使用单个较少的文件生成多个主题

Question

在较少的文件中，我有两个不同的颜色代码变量导入，截至目前我隐藏1导入而生成其他。我想改变方法就像有一个导入并使用Javascript动态地将我的颜色较少的文件传递给较少的文件。

Answer 1

如果您希望使用Javascript将变量传递给较少的文件，有两种方法：

1. 您可以使用javascript注入带有更新的CSS变量/属性的CSS样式表，或使用javascript直接设置CSS变量/属性。
2. 提供LESS样式表并在运行时在用户浏览器中编译它们或使用less.modifyVars.Enables运行时修改Less变量重新编译它们。使用新值调用时，将重新编译Less文件而不重新加载。

简单的基本用法：

        less.modifyVars({
          '@buttonFace': '#5B83AD',
          '@buttonText': '#D9EEF2'
        });

更多细节：http://lesscss.org/usage/#using-less-in-the-browser-modify-variables

编辑：

如果您需要在js中导入less文件：

import '../less/style.less'

或者，如果您需要在parent less文件中导入less文件：

@import "../less/style.less"

使用Mixins进行条件导入

@bt-color-variation: light;

@import "color-variations/@{bt-color-variation}/global";
@import "color-variations/@{bt-color-variation}/variables";