Skip to content

Latest commit

 

History

History
35 lines (21 loc) · 2.13 KB

linting.md

File metadata and controls

35 lines (21 loc) · 2.13 KB

Linting

A linter is a tool that analyzes source code to flag programming errors, bugs, stylistic errors, and suspicious constructs.

It can be used with a pretty printer and a validator. However, there are usually overlaps between these three types of tools.

Pretty printers

There are two approaches to enforcing stylistic conventions:

  • A machine algorithmically pretty prints the code (usually based on a maximum line length).
  • A human initially formats the code, and a machine fixes-up/warns-about any mistakes.

The former is handled by pretty printers, like prettier, whereas the latter is catered for by the built-in stylistic rules.

Additionally, the built-in stylistic rules and plugins are configurable to support this diverse range of stylistic conventions. This is in contrast to pretty printers, which tend to be opinionated. The ordering of properties within declaration blocks is an example of a divisive topic, where there is no one or two dominant conventions. The stylelint-order plugin adheres to stylelint's philosophies, and can be used to lint and fix a diverse range of ordering conventions.

Another example is the use of single-line rules for sets of related rules e.g.

/* Single-line related classes */
.class-1 { top: 0; bottom: 0; }
.class-2 { top: 5px; right: 0; }
.class-3 { top: 8px; left: 0; }

The built-in stylistic rules can be configured to allow both multi-line and single-line rules. The choice of when to use each belongs to the user, who can determine which rules are related.

Validators

Invalid code, e.g. misformed hex colors and unknown language features, is best handled by validators like csstree which is a language parser with syntax validation.

However, as a stop-gap while these tools mature, stylelint provides invalid code rules for the simplest of cases e.g. invalid hex codes and unknown CSS properties.

(In the future, these tools can be wrapped as plugins to make use of features such as /* stylelint-* */ command comments, severity levels, and options validator.)