覆盖不同项目中的sass变量

时间:2019-01-14 14:46:24

标签: angular sass angular-cli

我有多个项目,要覆盖两个不同项目中的scss color变量。

例如, 如果我正在运行项目A,我希望$ primaryColor为红色 如果我正在运行项目B,我希望$ primaryColor为绿色

我的项目树 -Project_A -Project_B -Shared_Component_Library -样式库     -color_palette.scss

Project_A和Project_B都在使用Shared_Component_Library 并且Shared_Component_Library从Style_Library获得样式。

当我运行不同的项目时,如何用不同的值覆盖scss color变量?

如果有帮助,我正在使用angular-cli来构建多个项目

1 个答案:

答案 0 :(得分:1)

有很多方法....

第一

您必须在每个项目中放入一个覆盖了变量的小型scss文件...这些文件应包括您共享的scss文件...但是它将创建2个文件。...

首尾一半

如果您不想复制整个css文件,则可以将需要重写的scss组件提取到另一个文件中,该文件将被复制...

第二

如果您不受限制并且可以成为IE11的例外(请看此处https://caniuse.com/#feat=css-variables),而不是使用scss变量,则可以仅使用css变量...

PS

我没有给您一些代码,也许您需要查看如何包含和覆盖?

您可以看一下如何用scss完成bootstrap 4,您将看到变量是如何完成的...