@koshikishi/stylelint-config

The Stylelint shareable config designed for my personal projects.

Use it as is or as a foundation for your own configuration file.

Installation

Install the package and stylelint in your project:

npm i -D stylelint @koshikishi/stylelint-config

Extends and plugins

This config:

• extends the stylelint-config-standard-scss shared config
• bundles the @stylistic/stylelint-plugin to replace removed stylistic rules

These are direct dependencies that will be installed automatically.

Usage

Set your stylelint config to:

{
  "extends": "@koshikishi/stylelint-config"
}

Extending the config

Add a "rules" key to your config, then add your overrides and additions there.

For example, to add the color-function-notation rule and turn off the selector-class-pattern rule:

{
  "extends": "@koshikishi/stylelint-config",
  "rules": {
    "color-function-notation": "modern",
    "selector-class-pattern": null
  }
}

You can also override the stylistic rules from @stylistic/stylelint-plugin and SCSS-specific rules:

{
  "extends": "@koshikishi/stylelint-config",
  "rules": {
    "@stylistic/indentation": 4,
    "scss/declaration-nested-properties": null
  }
}

Integration with VS Code

1. Install the Stylelint extension for VS Code.
2. Install stylelint and this config in your project following the Installation section.
3. Add a Stylelint configuration file (stylelint.config.js or .stylelintrc.*) and extend it with this shareable config following the Usage section.

Useful links

• Changelog
• Stylelint documentation