Question

我正在尝试使用Bootstrap CSS创建具有多种配色方案的CSS主题。每种配色方案都构建为boostrap.less文件的修改版本：bootstrap-red.less，bootstrap-green.less，依此类推。

每个Bootstrap版本所做的是导入所有默认的Bootstrap文件，然后导入适当的调色板，然后导入主题的核心结构。例如，bootstrap-red.less：

@import "reset.less";
@import "variables.less";
@import "mixins.less";

/* and so on... until */

// Custom code
@import "elements.less";
@import "_mytheme-color-scheme-red.less";
@import "_mytheme-core.less";

在_mytheme-color-scheme-red.less中，我定义了变量，例如：

@bannerBackground: #59a449;

然而，在编译bootstrap-red.less时，我得到了：

NameError: variable @bannerBackground is undefined in /.../css/less/_mytheme-core.less

为什么会这样？我原以为它会起作用，因为variables.less文件中的变量以相同的方式定义，并且可以在后续文件中使用。

我看过类似的问题并尝试过不同的事情，但无济于事：

@import

"_mytheme-color-scheme-red.less" _mytheme-core.less - 不可行;此外，Bootstrap不会这样做，但它仍然有效。
在没有BOM的情况下以UTF-8编码文件 - 不起作用，结果相同。

在我看来文件_mytheme-color-scheme-red.less根本没有被处理。好像Less编译器只是跳过它并直接进入_mytheme-core.less我该如何解决这个问题？

Answer 1

固定。毕竟问题是编码：LESS编译器正在跳过所有错误编码的文件。显然，即使你告诉它，Sublime Text也没有正确保存到没有BOM的UTF-8;我的文件都是ANSI或UTF-8 ，带有 BOM。我不得不求助于Notepad ++，以便将它们转换为普通的UTF-8。我现在觉得很蠢。

来源：Variable Name Error "is undefined" even though "variables.less" imported

Answer 2

编译Bootstrap 2时，LessCss 2.x出现类似错误，降级为LessCss 1.7.5为我解决了这个错误。

在Less CSS中定义文件中的变量

2 个答案: