Search code examples
cssangularangular-componentsscss-lint

How to remove WebStorm sass-lint error "Unknown pseudo selector 'ng-deep'"


Angular 2+ with scss and ::ng-deep in WebStorm highlights this selector with text "Unknown pseudo selector 'ng-deep'"

I tried something like:

selector-pseudo-class-no-unknown: true
  ignorePseudoClasses: ng-deep

or

selector-pseudo-class-no-unknown: false

None of this works.

How to set exception in scss-lint.yml for this pseudo-selectors?


Solution

  • ::ng-deep is pseudo element, not pseudo class. This is equivalent in my .stylelintrc

    {
      "rules": {
        "selector-pseudo-element-no-unknown": [true, {
          "ignorePseudoElements": ["ng-deep"]
        }]
      }
    }
    

    Also you need to uncheck Settings -> Inspections -> CSS -> Invalid Elements -> Invalid CSS pseudo selector