管理Humongous LESS文件

Question

我从一个不可维护的LESS文件变成了样式中的以下内容。

@import "site/auth.less";
@import "site/suggestions.less";
@import "site/header+footer.less";
@import "site/home.less";
@import "site/info.less";
@import "site/profile.less";

因此，style.less仅负责将所有单独的较少文件一起编译为我的应用程序的单个CSS文件。

但是在这些较少的文件中，我在顶部有以下行：

 @import "master.less";

其中包含每个其他较少文件所依赖的所有常见变量，颜色，字体等。

这是有效的，但我有两个问题：

1. 每次我对site/info.less进行更改时，我都必须同时保存该文件和style.less以触发重新编译。
2. 我编译的CSS包含master.less 6次的内容。

我该如何解决这些问题？

Answer 1

关于＃2

LESS 1.5现在允许引用导入，如下所示：

@import (reference) "master.less";

这只会导入一个文件以供参考，而不能编译为css。因此，您可以将它放在每个单独文件的顶部，而不必在您的CSS中显示6个版本。

当然，如果您确实希望它为style.less至少编译一次css，那么您实际上希望将其正常包含在该文件的顶部。但如果它实际上只是变量和要引用的东西，那么就不需要了。

关于＃1

This SO answer可能会为您提供一些解决方案。