/stylelint

A mighty, modern CSS linter

Primary LanguageJavaScriptMIT LicenseMIT

stylelint

NPM version Travis Build Status AppVeyor Build Status Join the chat at https://gitter.im/stylelint/stylelint

A mighty, modern CSS linter that helps you enforce consistent conventions and avoid errors in your stylesheets.

Features

  • A hundred rules: From stylistic rules (e.g. checking the spacing around the colon in declarations) to rules that catch subtle coding mistakes (e.g. invalid hex colors or overriding shorthand properties).
  • Support for the latest CSS syntax: Including custom properties, range context for media features, calc() and nesting.
  • Understands CSS-like syntaxes: The linter is powered by PostCSS, so it understands any syntax that PostCSS can parse, including SCSS.
  • Completely unopinionated: Only enable the rules you want, and configure them with options that tailor the linter to your needs.
  • Shareable configs: If you don't want to craft your own config, you can extend a shareable config.
  • Support for plugins: It's easy to create your own rules and add them to the linter.
  • Options validator: So that you can be confident that your config is valid.

Example output

Example

Quick start

With stylelint, it's easy to start linting your CSS:

  1. Install stylelint: npm install stylelint.
  2. Choose whether you want to craft your own config or extend a pre-written, shared config.
  • If you want to use a pre-written config, just find one and extend it. We recommend trying stylelint-config-standard, which includes around 60 of stylelint's rules with sensible defaults. (You can always override specific rules after extending a config.)
  • To craft your own from the ground up, just learn about some rules. All of the rules are off by default, so you only have to learn about the rules you want to turn on and enforce. That way you can start small, growing your config over time as you have a chance to explore more of the rules. Alternately, copy-paste this example configuration, which lists all of stylelint's rules and their primary options, then remove (or turn off) the rules you don't want and edit the primary option of each rule to your liking.
  1. Create your configuration, probably as a .stylelintrc file.
  2. Decide whether to use the CLI, Node API, or PostCSS plugin.
  3. Lint!

Guides

You'll find more detailed information on using the linter and tailoring it to your needs in our guides:

  • User guide - Usage, configuration and complementary tools.
  • Developer guide - Contributing to stylelint and writing your own plugins & formatters.

Important Documents