@kwai-explore/stylelint-config

💿 Installation

pnpm install --save-dev stylelint @kwai-explore/stylelint-config
# or
npx install-peerdeps --pnpm --dev @kwai-explore/stylelint-config

📖 Usage

Set your .stylelintrc.mjs to:

export default {
    overrides: [
        {
            files: ['**/*.(css)'],
            extends: ['@kwai-explore/stylelint-config/scss'],
        },
        {
            files: ['**/*.(scss)'],
            customSyntax: 'postcss-scss',
            extends: ['@kwai-explore/stylelint-config/scss'],
        },
        {
            files: ['**/*.(html|vue)'],
            customSyntax: 'postcss-html',
            extends: ['@kwai-explore/stylelint-config/vue'],
        },
    ],
    rules: {},
};

💻 Third party tool integrations

lintstaged

add this line to your lintstaged config

{
    // ↓ Add stylelint for css.
    "**/*.{css,scss,vue}": ["stylelint --cache --fix --allow-empty-input"]
}

Visual Studio Code integration

Use the stylelint.vscode-stylelint extension that Stylelint provides officially.

You have to configure the stylelint.validate option of the extension to check .vue files, because the extension does not check the *.vue file by default.

Example .vscode/settings.json:

{
  "stylelint.validate": [
      ...,
      // ↓ Add "vue" language.
      "vue"
  ]

npm script

{
    "scripts": {
        "lint:css": "stylelint './**/*.{vue,css,scss}'"
    }
}

🔒 License

See the LICENSE file for license rights and limitations (MIT).