vscode-stylelint

A Visual Studio Code extension to lint CSS/SCSS/Less with stylelint

Installation

Execute Extensions: Install Extensions command from Command Palette.
Type @sort:installs stylelint into the search form and install the topmost one.

Read the extension installation guide for more details.

Optional (but recommended) setup

To prevent both the editor built-in linters [css] [less] [scss] and this extension [stylelint] from reporting essentially the same errors like in the screenshot, disable the built-in ones in User or Workspace setting:

"css.validate": false,
"less.validate": false,
"scss.validate": false

Usage

Once a user follows the stylelint startup guide by creating a configuration file or by editing stylelint.* VSCode settings, stylelint automatically validates documents with these language identifiers:

CSS (css)
HTML (html)
Less (less)
JavaScript (javascript)
JavaScript React (javascriptreact)
Markdown (markdown)
Markdown+MathML (source.markdown.math)
PostCSS (postcss)
Sass (sass)
SCSS (scss)
styled-components
- Official (source.css.styled)
- Userland (styled-css)
Sugarss (sugarss)
Svelte (svelte)
TypeScript (typescript)
TypeScript React (typescriptreact)
Vue (vue, vue-html)
XML (xml)
XSL (xsl)

Extension settings

Though it's highly recommended to add a stylelint configuration file to the current workspace folder instead, the following extension settings are also available.

stylelint.enable

Type: boolean
Default: true

Control whether this extension is enabled or not.

stylelint.configOverrides

Type: Object
Default: null

Set stylelint configOverrides option.

stylelint.config