3

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

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

手表

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

预期的输出文件存在并且自昨天以来没有更改。

我怎样才能让 scss 只编译更改的文件。

4

1 回答 1

7

在过去的几天里，这也让我很烦恼，我想我已经找到了一个替代解决方案。我在上面看到你让它工作了，但我想我还是分享一下，以防它对某人有帮助。

它需要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不会发生。如果缓存中的版本不同（未命中），则将内容写入磁盘。

于 2015-08-05T23:49:11.133 回答