yuschick/stylelint-plugin-defensive-css

How to install the plugin?

budarin opened this issue · 2 comments

Describe the bug
Have added the plugin to the package.json and have added rules to the stylelint config but got the error: Unknown rule plugin/use-defensive-css.Stylelint(plugin/use-defensive-css)

To Reproduce
Steps to reproduce the behavior:

  1. setup the plugin in the project by adding to the packacge.json with npm or yarn
  2. add rules to the stylint config
  3. open any css file

Expected behavior
To have no errors in stylint config and working the plugin

module.exports = {
    extends: ['stylelint-config-standard'],
    rules: {
        'plugin/use-defensive-css': [true, { 'accidental-hover': true }],
        'plugin/use-defensive-css': [true, { 'background-repeat': true }],
        'plugin/use-defensive-css': [true, { 'custom-property-fallbacks': true }],
        'plugin/use-defensive-css': [
            true,
            { 'custom-property-fallbacks': [true, { ignore: [/hel-/, 'theme-'] }] },
        ],
        'plugin/use-defensive-css': [true, { 'flex-wrapping': true }],
        'plugin/use-defensive-css': [true, { 'scroll-chaining': true }],
        'plugin/use-defensive-css': [true, { 'scrollbar-gutter': true }],
        'plugin/use-defensive-css': [true, { 'vendor-prefix-grouping': true }],
    },
};

Looks like I have done a poor job in the README. But can you ensure you have the plugin listed under plugins in your stylelint config?

module.exports = {
  ...any other stylelint config options you may have

  plugins: [
    ...any other stylelint plugins you may have
    "stylelint-plugin-defensive-css",
  ],

  rules: {
    ...any other stylelint rules you may have
    "plugin/use-defensive-css": [
      true,
      {
        severity: "warning",
        "accidental-hover": true,
        "background-repeat": true,
        "custom-property-fallbacks": true,
        "flex-wrapping": true,
        "scroll-chaining": true,
        "scrollbar-gutter": true,
        "vendor-prefix-grouping": true,
      },
    ],
  }
}

Try adding this to the plugins array and see if that gets this working for you. Sorry about the poor documentation in the README. I will get it updated 🤘

Thanks, it works!