Sass-前缀从文件导入的所有类（使用sass import或webpack loader）

Question

这个问题可能非常愚蠢和重复，但是我找不到解决我问题的可行方法。抱歉，如果其他地方都没有回答。

我想要做的是在一个项目中使用2个CSS框架。

我必须使用语义作为主要的CSS框架-必须全局访问。例如，类为“ ui网格”的元素应使用语义UI的“ ui网格”行为。

但是然后，我想使用Bulma作为我的辅助框架。为避免冲突，我想为所有布尔玛类添加一个静态前缀。因此，例如布尔玛的“模态”类可以作为“布尔玛模态”访问。像这样的东西：

  .&bulma {
    @import '~bulma/bulma';
  }

这将（希望）避免所有类冲突，并且仍然让我在同一范围内同时使用语义和布尔玛。

感谢您的帮助或建议。

Answer 1

在你的 bulma scss 文件中尝试这样

$my-name: mycss--;

.#{$my-name}btn {
  ...
}

.#{$my-name}input {
  ...
}

.#{$my-name}header {
  ...
}