But what good is a standards and best-practices document if they aren’t enforced? You might be able to catch some during a code review but this is a manual, tedious task. It’d be better to catch these code standards violations early in the development process. That’s where Stylelint comes in – it automates the code standards adherence checks.
We implemented code standards for CSS/SCSS just like we did for JavaScript and utilize Stylelint to automatically check for issues. An example is alphabetical order for CSS properties. This is a standard we implemented here at TRYTN to make code very easy to read. It’s a pain to manually enforce this rule but Stylelint makes it easy. If properties are out of order a warning is generated any time files are re-generated to let the developer know there’s an issue with line and character number.
What’s also nice is Stylelint also checks for code standards conformity. If an invalid property or value is passed or a syntactic error is found in the CSS/SCSS it will automatically generate an error. The SCSS will then not transpile to CSS and the build will fail. Meaning if there’s a syntax issue in the CSS we aren’t putting a bad build out into production.
Package Name: Stylelint
Website: https://stylelint.io/