css - Angular2 在运行时覆盖 css

Question

我正在使用 Angular Material2 混合在名为 my-theme.scss 的文件中构建不同的主题。当编译元素用于生产时，ng build 将生成一个名为 styles.xxxxxxxxxxx.bundle.css 的样式文件。

如果我想在部署到生产服务器后为特定客户端构建不同的主题，有没有办法在不重新编译和重新部署应用程序的情况下覆盖主题？比如把主题的css外化等等？

请注意，我不想覆盖特定组件的自定义样式，而只想覆盖使用 Angular Material mixins 构建的主题。

Answer 1

一个选项是添加 <link rel="stylesheet" type="text/css" href="/theme.css">进入你的 index.html。这将优先于 styles.xxxxx.bundle.css。但是，您必须在每个环境的最终构建中提供该文件。对于当前的产品构建，您可以将其留空以避免任何冲突。