When linting something other than plain CSS, such as SCSS or Less, you should install an appropriate syntax package like "postcss-scss" for SCSS or "postcss-less" for Less, and specify it using the customSyntax option in your linter configuration. This customSyntax option tells the linter to parse with the correct syntax parser for the language you're linting, allowing accurate linting without syntax errors. For example, for SCSS:
- Install postcss-scss.
- Use the customSyntax option in your Stylelint config to point to "postcss-scss".
This approach is recommended because CSS preprocessors like SCSS extend CSS syntax and require custom parsing beyond plain CSS syntax. The linter treats these syntax packages as PostCSS syntaxes to understand and correctly parse the styles being linted. This method is documented in Stylelint's setup and migration guides and is commonly required to avoid errors such as "Unknown word" when linting SCSS files with Stylelint without this configuration.
