当包含的文件被更改时，Gulp less而不是building less

Gulp-less not building LESS when included file is changed

本文关键字：less Gulp building 包含 文件      更新时间：2023-09-26

我使用以下文件夹结构：

css
|_ main.css
|
|_ less
   |_ main.less
   |_ sub.less
   |
   |_ shared
      |_ variables.less
      |_ header.less
      |_ footer.less

我在gulpfile.js中使用以下内容

gulp.task('less', function() {
    gulp.src(paths.less + 'main.less', {read: true})
        .pipe(plugins.plumber({errorHandler: onError}))
        .pipe(plugins.less({
            paths: [paths.less + 'shared', paths.less]
        }))
        .pipe(plugins.plumber.stop())
        .pipe(gulp.dest(paths.css));
});
...
gulp.task('less:watch', function(){
    gulp.watch([paths.less + '**/*.less'], ['less']);
});
gulp.task('default', ['less', 'less:watch']);

我的main.less包括所有其他less文件的@imports。

@import "sub.less";
@import "./shared/variables.less";
@import "./shared/header.less";
@import "./shared/footer.less";

  • 如果更新了LESS文件（不是main.LESS），则文件main.css不会更改。

  • 如果更新了main.less（在任何其他less文件更改后需要），则main.css将更新。

如何修改gulpfile.js以更新"main.css"文件不管哪个LESS文件被更改？

谢谢。

我无法直接重现您的问题，但我预计这可能是因为修改后的文件是从文件系统文件缓存中读取的。

Less使用fs.readFile调用来读取导入的文件。默认情况下，此调用会打开带有r选项的文件。文档没有明确说明r选项使用文件系统文件缓存，但文档确实告诉您rs选项绕过文件系统文件高速缓存：

"rs"-打开文件以在同步模式下进行读取。指示操作系统绕过本地文件系统缓存。

这对于在NFS装载上打开文件非常有用，因为它允许您可以跳过可能过时的本地缓存。它有一个非常真实的影响I/O性能，所以除非您需要，否则不要使用此标志。

请注意，这不会将fs.open（）变成同步阻塞呼叫如果这是你想要的，那么你应该使用fs.openSync（）

可能的解决方案：

让Less使用rs选项打开文件。找到node_modules/gulp-less/node_modules/less/lib/less-node/file-manager.js文件并将第56行替换为以下代码：

fs.readFile(fullFilename, {encoding: 'utf-8', flag: 'rs'}, function(e, data) {

否则，您可能会想知道为什么修改后的文件仍在文件缓存中，并尝试rsync文件缓存：https://superuser.com/questions/319286/how-to-totally-clear-the-filesytems-cache-on-linux

有一个针对您的工作流的gullow子代插件。

相关文章：