Sass Angular + 主题

Question

我对 sass 和 Angular 6 的使用有疑问。我的目标是有几个模板：一个蓝色和一个橙色，所以我想创建 2 个 variables.scss 文件，每个文件中都有变量，然后通过角度，我无法实现这一点，考虑到我会优化到最大文件 css 的重量（我找不到一个简单的解决方案来实现）。

thk

Answer 1

我建议你使用一个具有不同属性的 scss 文件。

例子

$themes: (
  light: (
    backgroundColor: #fff
  ),
  dark: (
    backgroundColor: #222
  ),
);

然后在您的应用中使用以下内容

<main id="app-root" [class]="theme">

</main>

let theme = 'theme-light'; // or theme-dark

以上参考
* easy-color-theming-with-scs
* organizing-multiple-theme-styles-with-sass
* Similar question

创建了一个小plunkr