事情是这样的。我的 LESS 文件有以下结构:
/less/root.less
/less/includes1/*.less (a lot of less files)
/less/includes2/*.less (a lot of less files)
我正在使用gulp来编译我的LESS文件。源:
gulp.task('less', function () {
var combined = combiner.obj([
gulp.src('./less/**/*.less'),
less(),
gulp.dest('./www/dist/screen.css')
]);
// any errors in the above streams will get caught by this listener, instead of being thrown:
combined.on('error', console.error.bind(console));
return combined;
});
问题出在指定的路径中。我理解这条路径./less/**/*.less
这样的:递归地遍历所有文件夹并编译所有以 .less
结尾的文件。问题是编译器想要逐个编译每个文件,并且不知道所有文件都包含在我的source.less
中。它不查找根文件,也不知道哪些文件是包含的部分,哪些是根文件。
如何告诉 LESS 解析器哪些文件是根文件以及要导入哪些文件。在 SASS 中,它通过文件名中的下划线指定,如下所示:_includedPart.scss。
你可以使用 https://github.com/robrich/gulp-ignore。请参阅:如何使用 glob 忽略以下划线开头的文件?
var condition = '_*.less'; //exclude condition
gulp.src('content/**/*.less')
.pipe(gulpIgnore.exclude(condition))
在许多情况下,您将所有 Less 代码放入单个 CSS 文件中。您的主文件包含@import
指令,该指令指向所有其他所需的 Less 文件。