出现了以下问题：您可以使用通用 BEM 类为块设置样式，例如：
<div class = 'parent'>
<button class = 'button parent__button'> button </button>
</div>
.button {
border: none;
background: white;
}
.parent__button {
position: relative;
}
或者你可以在 SASS 中使用 mixin 或模板
@mixin button($border, $background) {
border: $border;
background: $background;
}
.parent__button {
@include button(none, white);
}
然后 HTML 将如下所示，没有通用的通用按钮类：
<div class = 'parent'>
<button class = 'parent__button'> button </button>
</div>
这样你就可以用 SASS mixin 或 SASS 模板替换 BEM 修饰符。这可以减轻 HTML 的负担并将其重定向到 CSS。
考虑到这两种方法，如何正确弥补？特别感兴趣的是一个有/有生产经验的人的回答，在这个问题的背景下，商业开发中使用了什么实践？将 BEM 应用于一般块或块元素样式，还是使用 mixin？感谢您参与这场战斗。
为了减轻 HTML 的负担，最好使用 PUG。您有点困惑，您提供的两个代码是不同的，它们不会相互替换。在第一种情况下，您的按钮是混合的。它既是按钮 BEM 块，也是父 BEM 块的元素。这是一个不错的选择，因为您可以在项目中的任何位置使用该按钮。在第二种情况下，按钮不再是一个独立的块。第一种情况（混合）用于为元素提供外部几何形状。Mixin 不会以任何方式影响项目的架构，它们只会让您避免项目中的代码重复。