Search code examples
laravelvue.jsvuejs2phpstormvue-component

PhpStorm. Disable CSS codestyle formatting

Currently I'm working with Vue.js components.

The problem is that I have such a style block

<style scoped>
    .some-class >>> .multiselect__tags {
        /*...*/
    }
</style>

and PhpStorm 2017.3.6 is constantly converting it into

<style scoped>
    .some-class > > > .multiselect__tags {
        /*...*/
    }
</style>

what is, obviously, an error, cause >>> is a Vue.js-specific combinator. More about it here.

Did I miss a solution except for the /deep/ combinator?

Solution

  • You will have to upgrade your IDE to next 2018.1 version -- it was fixed there (see https://youtrack.jetbrains.com/issue/WEB-26828)

    • WebStorm 2018.1 is already released
    • PhpStorm 2018.1 will be released soon (expected this week)

    You may use Release Candidate build meantime if you need this functionality right now in PhpStorm.