改口而不起作用

Question

我以前用过用JS改变的gulp，没有问题。但是，现在我试图在我的gulp-changed文件上使用gulp-newer和gulp-newer，而不检测哪个文件已经更改。

var changed    = require('gulp-changed');
var newer = require('gulp-newer');
var SRC = './stylesheets/**/*.scss';
var DEST = './stylesheets';

gulp.task('sass', function () {   
    return gulp.src(SRC)
        .pipe(changed(DEST)) //tried newer here as well 
        .pipe(sass())
        .pipe(gulp.dest(DEST))
});

当更改scss文件时，它将输出，但没有更改任何scss。

[BS] Watching files...
[09:26:13] Starting 'sass'...
[09:26:14] Finished 'sass' after 180 ms

Watch

gulp.task('watch', ['setWatch', 'browserSync'], function () {
    gulp.watch('./stylesheets/**/*.scss', ['sass']);
});

预期的输出文件存在，自昨天以来一直没有更改。

如何使scss只编译已更改的文件。

Answer 1

这在过去的几天里一直困扰着我，我想我找到了另一个解决方案。我在上面看到你让它起作用了，但我想我还是和别人分享吧，以防它对别人有帮助。

它需要gulp-cached (我已经在使用它，但也无法让gulp-changed或gulp-newer工作)。最初，我在编译管道的开头尝试了缓存，比如changed|newer (应该如何？)工作，但也失败了。过了一分钟，我意识到我明显的错误:在所有处理和输出文件都准备好写入目标目录之后，缓存操作就必须发生，但就在此之前。

因此：

gulp.watch('path/to/**/*.scss')
    .pipe(sass())
    <<... rename, minify, etc ...>>
    .pipe(cached('sass_compile'))
    .pipe(gulp.dest('path/to/dest/'));

就这样。当Gulp进程启动时，缓存是空的，因此所有Sass文件都被编译，它们的编译版本(CSS)被添加到缓存中，然后写入磁盘。

然后，当您编辑和保存SCSS文件时，Sass将再次重新编译与src glob匹配的所有内容，但是如果内容匹配(缓存命中)，那么SCSS中只更改了空格或格式，对gulp.dest的调用就不会发生。如果缓存中的版本不同(误)，则将内容写入磁盘。