在 Rails 3 中导入 LESS 变量答案

【问题标题】：Import of LESS variables in Rails 3在 Rails 3 中导入 LESS 变量
【发布时间】：2012-08-01 23:18:47
【问题描述】：

我的资产文件夹中有一个 global.less 文件，我在其中定义了许多站点范围的变量。

为了在其他 less 文件中使用这些变量，我目前将其放在每个文件的顶部：

@import 'global';

这加载一切正常，但现在我有一个全局副本加载到每个更少的文件中。我想知道是否有办法在项目中只编写一次导入，并让其他较少的文件能够访问它？

【问题讨论】：

标签： css ruby-on-rails-3 asset-pipeline less

【解决方案1】：

您只需要做两件小事就可以做到这一点。

通过将 application.css 重命名为 application.less 或 application.css.less 将其创建为 .less 文件。
删除require_tree . sprocket 指令，该指令将自行导入样式表目录中的文件，从而无法定义顺序。

完成这些事情后，它应该可以按您的预期工作，简单地说：

// in global.less
@foo: #FFFFFF;

// in foo.less
.foo {
  background-color: @foo;
}

// and finally in application.less
@import 'global';
@import 'foo';

【讨论】：

但我发现这种做法存在问题。很多时候，我们需要使用“require tree”。和'require_self'。在此示例中，这些方法将不可用，因为您使用的是 .sass 文件而不是 .css。然后有必要在每个动作样式表中创建一个“@import”。
没有。这里的重点是这个方法抛弃了require_tree，取而代之的是less 自己的@import 功能，它创建了一个全局命名空间，保持mixin 和变量可用，而sprockets 的require 没有。请注意，这个问题是针对较少的，并且 not 正如您提到的那样，但同样的原则适用于两者。有关 sass github 上的问题，请参阅 this note。