# 规则

  • 使用 BEM 的命名风格
  • 单文件组件,样式应该统一在一个命名空间下,避免污染其他组件或全局样式。
  • 不要在组件内修改 htmlbody#mfe-app 等 DOM 元素的样式。
  • 不要在组件内修改其他组件的样式,除非这个组件是当前组件的子组件(即被调用了)。但这个时候也要注意影响面。

# 组件样式示例

<template>
    <div class="e-button">
        <div class="e-button__prefix"></div>
        <EIcon name="xxx"/>
    </div>>
</template>
<style lang="scss">
.e-button { /* CSS 命名空间 */
    &__prefix { /* BEM 风格 */

    }

    .e-icon { /* 子组件样式覆盖 */

    }

    &--active { /* BEM 风格 */

    }
}
</style>