npm 的 less 库——如何为导入定义子目录

Question

我正在尝试配置使用 npm 的 less 库的 ServiceStack 捆绑器。

我有很多子目录，我存储的文件较少。

我遇到一个问题，即对 less 文件的更改不会在编译时触发。如果我像这样在我的捆绑文件中直接引用该文件，它们就会这样做：

scaffolding/grid.less

但不是这样使用的：

捆绑文件：main.less

main.less: @import "scaffolding/grid.less"

第一个选项会导致更多关于重复代码的问题，目前不是可行的方法。

之前问过一个不同的问题，看来编译器可能没有找到@imports 的路径。但是有一个配置部分使用了 npm 的 less 库。

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

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

您可以看到我是如何尝试添加我的子目录的，但它没有任何效果 - 我定义子目录的方式不正确，子目录具有 wrong/incomplete 路径，或者它是正确的，但编译器仍然不接受它。

我不知从何而来。

感谢任何建议。

Answer 1

我的错误，但不容易被发现，所以我会 post 我的问题的原因，这样其他人就不会像我一样花几个小时来寻找解决方案不必要的问题。

我正在使用 ServiceStack Bundler - 我相信这个问题也会发生在任何使用 npm 的 less 库的解决方案上。

我的主要问题是 none 我的更改是在编译时触发的。我为我的 less 文件使用了很多 @imports 和许多子目录，所以我的第一个想法是问题是由于子目录，后来，由于 @import 语句。然而两者都不正确。

我定义了一个包：main.css.bundle

在包中，我调用了包含所有其他@imported 文件的主要 less 文件：main.less

问题是 less 通常会保留 main.css，但捆绑包也会根据捆绑包名称为其输出赋予相同的名称。所以两者都是矛盾的。

更改包名或主要的 less 文件名，一切都应该有效。

npm 的 less 库——如何为导入定义子目录

npm's less library - how to define a subdirectory for imports

node.js

npm

servicestack