如何使用stylelint来获取哈里罗伯特的BEM约定？

Question

PostCSS BEM Linter插件需要每个块的组件定义,这在遗留项目中是一件非常耗时的事情.

有没有办法使用stylelint检查类模式并在项目的所有样式表(在我的例子中为.scss)中显示错误,而不需要在每个文件/块中进行组件定义？

https://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/

.block {}
.block__element {}
.block--modifier {}

Answer 1

您可以使用 stylelint 的selector-class-pattern规则来使用正则表达式强制类选择器的模式。

然而，如果您正在编写类似 BEM 的 CSS stylelint-selector-bem-pattern，那么包装PostCSS BEM Linter 的更强大，因为它理解组件、元素、修饰符和实用程序类的概念。

有一个选项可以根据文件名隐式定义组件，从而无需在每个文件中定义组件。