是否有一個只有在保存scss文件時才編譯sass的gulp手錶替代方案？

Question

我正在尋找一種替代品，只有當我保存scss文件時纔會編譯scss的'gulp watch'任務。有沒有？

我在問這個問題，因爲當我的提示符中'gulp watch'保持活着時，當我開始修改我的scss文件中的內容時，它不可思議地放慢了我的計算機速度。

對不起，如果這是一個菜鳥問題，但我是Gulp新手！

我gulpfile.js看起來是這樣的：

var gulp = require('gulp'); 
 
var sass = require('gulp-sass'); 
 

 
//style paths 
 
var sassFiles = 'sass/**/*.scss', 
 
    cssDest = 'css/'; 
 

 
gulp.task('styles', function(){ 
 
    gulp.src(sassFiles) 
 
     .pipe(sass().on('error', sass.logError)) 
 
     .pipe(gulp.dest(cssDest)); 
 
}); 
 

 
gulp.task('watch',function() { 
 
    gulp.watch(sassFiles,['styles']); 
 
});

Answer 1

在你的榜樣，所有 SCSS文件編譯每一個文件改變時。這可能會減慢速度。

如果你只想編譯改變後的scss文件，你需要這樣做。

gulp.task('watch', function() { 
    gulp.watch(sassFiles, function(obj) { 
     return gulp.src(obj.path) 
      .pipe(sass().on('error', sass.logError)) 
      .pipe(gulp.dest(cssDest)); 
    }); 
});