@pro-vision/stylelint-config-pv

@pro-vision/stylelint-config-pv

This package provides pro!vision's Stylelint configuration as an extensible shared config. It follows the Idiomatic CSS for ordering properties.

Inspired by Stylelint's own stylelint-config-standard

Installation

npm i -DE stylelint-scss stylelint stylelint-order stylelint-declaration-use-variable @pro-vision/stylelint-config-pv

Prerequisite

You obviously need stylelint installed. Unless you are only using the plain css rules, you will also need to install some plugins

# default
npm i -DE stylelint  stylelint-scss stylelint-declaration-use-variable stylelint-order

# plain CSS only
npm i -DE stylelint

# scss rules
npm i -DE stylelint-scss stylelint-declaration-use-variable

# idiomatic css
npm i -DE stylelint-order

Usage

We export two configurations for usage in projects, with the possibility to include or exclude Idiomatic CSS

CSS + SCSS + Idioatic rules

Our default export contains all of our Stylelint rules, including SCSS plugins. Add an "extends": array to your .stylelintrc:

{
  "extends": [
    "@pro-vision/stylelint-config-pv"
  ],
  "rules": {
    // you can overwrite individual rules here
  }
}

CSS runles only rules

Alternatively, you can import whatever combination of the following rules suits your project:

{
  "extends": [
    "@pro-vision/stylelint-config-pv/plain-css",
    "@pro-vision/stylelint-config-pv/scss",
    "@pro-vision/stylelint-config-pv/order",
  ],
  "rules": {
    // you can overwrite individual rules here
  }
}

For information about individual rules see See

• the Stylelint rules reference
• the SCSS linting rules
• the declaration use variable rule
• the order rules

Text editor integration

There are a Visual Studio Code plugin and a Sublime Linter plugin for Stylelint.

According to the documentation,

Version 2016.3 onwards has built-in support for stylelint.