@captive/stylelint-config

Captive StyleLint configuration (@captive/stylelint-config)

StyleLint configuration presets

Installation

npm install --save-dev @captive/stylelint-config stylelint

Update your package.json :

{
  ...
  "scripts": {
    ...
    "lint:style": "stylelint \"app/**/*.{css,scss}\"",
    "format:style": "stylelint \"app/**/*.{css,scss}\" --fix"
  },
  "stylelint": {
    "extends": [
      "@captive/stylelint-config"
    ]
  }
}

add stylelintignore file :

/public
/node_modules
/tmp
/log
/vendor

/www
**/*.bundle.scss
**/generateur/**/*.scss
**/vendor/**/*.scss
**/root/**/*.scss

/app/assets/builds
**/*.min.css

Usage

To check your style :

npm run lint:style

To autocorrect your style :

npm run format:style

Features :

• CSS and SCSS validation

Common Errors

😩 My project has too many errors

Explanation

the configuration is very strict, it is normal to have many errors

Solution

Solution 1 : Auto-correct all errors

npm run format:style

Solution 2 : Ignore errors and progressively fix them

create .stylelint_todo.cjs for all non passing rules. It is advised to fix them later, rule by rule :

module.exports = {
  rules: {}
}

update your package.json :

{
  ...
  "stylelint": {
    "extends": [
      "@captive/stylelint-config",
+     "./.stylelint_todo.cjs"
    ]
  }
}

License

MIT © Julien Polo [e-mail]

About Captive

@captive/stylelint-config is maintained and funded by Captive. The names and logos for captive are trademarks of captive-studio.

We love open source software! See our other projects or hire us to design, develop, and grow your product.