css - ServiceStack Bundler 和子目录 Less 文件

Question

直到最近我还在使用相当笨拙的无点。因为我使用的是 VS2010，所以我只能使用我可以使用的东西，但是我遇到了 ServiceStack Bundler，它似乎工作得很好......除了一件事。

我的 Less 文件使用目录结构拆分 - 以简化事情，如下所示:

scaffolding/my-scaffolding.less
utilities/my-utilities.less
ui/my-ui.less

每个目录都有很多文件，尤其是 mixin 等。

为了将它们链接在一起，我一直在使用 @import 函数。

我的主要 less 文件 - main.less 包含以下内容:

@import "utilities/all-utilities.less"

此处列出了所有实用程序，因为它使我能够即插即用各种文件集。此代码以前工作正常。

但是我发现 ServiceStack 不会接受更改，除非我通过 bundle 文件单独直接引用所有 less 文件，这有点痛苦。

所以，我不能使用:main.less 并导入所有子文件。

相反，我必须使用:

utilities/util1.less
utilities/util2.less
utilities/util3.less

等等。

我正在使用 ms build 函数进行编译。

有什么想法吗？

/* 更新 */

尝试了下面推荐的答案但没有成功。

这是我到目前为止尝试过的:

调用包含所有@import 声明的单个 less 文件；不会在编译时触发更新。

从 bundle 文件调用所有 less 文件，并在必要时将 @import 语句添加到 less 文件(注意，没有这些，bundler 将无法编译)；复制 @imported 代码的次数与使用 @import 语句的次数一样多 - 即使使用(引用)指令，也会导致代码臃肿/不正确。

Answer 1

您应该能够将 Bundler 的 bundler.js 文件修改为 specify additional paths less 应该在处理 @import 指令时搜索:

function compileLess(lessCss, lessPath, cb) {
    var lessDir = path.dirname(lessPath),
        fileName = path.basename(lessPath),
        options = {
            paths: ['.', lessDir], // Specify search paths for @import directives
            filename: fileName
        };

    less.render(lessCss, options, function (err, css) {
        if (err) throw err;
        cb(css);
    });
}