stylelint-config-visionapps

VisionApps' shareable config for Stylelint.

Extends stylelint-config-standard with more strict rules and giving preference to indentation with 4 spaces.

To see the rules that this config uses, please read the config itself.

Installation

Install Stylelint and this config:

$ npm install --save-dev @visionappscz/stylelint-config-visionapps

Usage

Apply the config in your Stylelint config:

{
  "extends": "@visionappscz/stylelint-config-visionapps"
}

Suggested Extension

👉 To further extend control over coding style of your stylesheets, you can also check for rules order using stylelint-order plugin along with our config @visionappscz/stylelint-config-visionapps-order.

Known Gotchas

• A unit must be present inside calc() expressions even with zero-length values. This config disallows using a unit for zero-length values which is useful most of the time so we recommend throwing a stylelint-disable length-zero-no-unit comment to suppress this rule when necessary.

• Max line length is exceeded with inline data URIs. You may need to turn this rule off with stylelint-disable max-line-length.

Head to Styleint docs to see how to ignore code fragments during lint.

Usage with SCSS Syntax

The config is broadly compatible with SCSS syntax. You will only need to adjust the rule that checks at rules:

{
  "extends": "@visionappscz/stylelint-config-visionapps",
  "rules": {
    "at-rule-no-unknown": [
      true, {
        "ignoreAtRules": [
          "at-root",
          "content",
          "debug",
          "each",
          "else",
          "else if",
          "error",
          "extend",
          "for",
          "forward",
          "function",
          "if",
          "include",
          "mixin",
          "return",
          "use",
          "warn",
          "while"
        ]
      }
    ]
  }
}

To go even further, you can check SCSS specific rules with stylelint-scss plugin.

There is also stylelint-config-recommended-scss which disables check of at rules entirely.