at-extend-disallowed-list

Stylelint rule for specifying a list of disallowed selectors to at-extend (@extend).

Installation

npm install stylelint-at-extend-disallowed-list --save-dev

Usage

Add this config to your Stylelint configuration file:

{
  "plugins": ["stylelint-at-extend-disallowed-list"],
  "rules": {
    "plugin/at-extend-disallowed-list": [
      [
        "array",
        "of",
        "selectors"
      ]
    ]
  }
}

The message secondary option can accept the arguments of this rule.

Options

array|string: ["array", "of", "selectors"]|"selector"

[!NOTE] This rule currently checks for exact string matches between the defined selector(s) and each @extend declaration. If any single @extend declaration uses multiple selectors, that exact string of multiple selectors has to be defined in the rule to be caught.

Given:

[".foo", "%bar", "%foo\\/bar"]

The following patterns are considered problems:

a {
  @extend .foo;
}

a {
  @extend %bar;
}

a {
  @extend %foo\/bar;
}

The following patterns are not considered problems:

a {
  @extend .foo-bar;
}

a {
  @extend .foobar;
}

a {
  @extend %foo;
}

a {
  @extend .bar;
}

a {
  @extend %foobar;
}