Photo by Inside Weather on Unsplash.
CSS linting has been gaining traction lately. I've used CSSLint the last years in some of my projects. Then, a while ago I found out about stylelint and realised it's the best tool for the job, together with PostCSS. Stylelint is a really good mistake-preventing machine as it helps you enforce consistent conventions.
I took the time to read the excellent rules documentation and added stylelint setup for Sass files in my webpack-es6-sass-setup. Configuration includes all the available rules but I've turned off the ones that I don't currently need. I use BEM, so I've added stylelint-selector-bem-pattern plugin as well. It's a bit of a challenge to get the regular expression patterns right, so that part needs some tweaking to allow selectors like this: .main-component__status.is-active. Here's my .stylelintrc configuration file. Initial configuration for stylelint takes some time but it's totally worth it!