gulp-rev不能與gulp-watch一起工作

Question

下面是我的代碼我的主要問題我必須觀察js和css的變化，並且基於生成min文件的正確版本，我的輸出目錄也是一樣的。

'use strict'; 

var gulp = require('gulp'); 
var rename = require('gulp-rename'); 
var uglify = require('gulp-uglify'); 
var watch = require('gulp-watch'); 
let cleanCSS = require('gulp-clean-css'); 
var rev = require('gulp-rev'); 
var jsArr = [ 
    'search/media/src/js/*.js', 
    //'common/media/js/*.js', 
    '!search/media/src/js/*.testmin.js', 
    '!search/media/src/js/*.min.js' 
      // '!common/media/js/*.testmin.js', 
]; 

var cssArr = [ 
    'search/media/css/*.css', 
    '!search/media/css/*.testmin.css', 
    '!search/media/css/*.min.css' 
]; 


gulp.task('js', function() { 
    //return gulp.src(jsArr, {base: './'}) 
    return gulp.src(jsArr) 
      .pipe(watch(jsArr)) 
      .pipe(uglify()) 
      .pipe(rename({suffix: '.testmin'})) 
      .pipe(rev()) 
      .pipe(gulp.dest(function (file) { 
       return file.base; 
      })) 
      .pipe(rev.manifest({ 
       merge: true 
      })) 
      .pipe(gulp.dest('./')); 
}); 

gulp.task('css', function() { 
    //return gulp.src(cssArr, {base: './'}) 
    return gulp.src(cssArr) 
      .pipe(watch(cssArr)) 
      .pipe(cleanCSS()) 
      .pipe(rename({suffix: '.testmin'})) 
      .pipe(rev()) 
      .pipe(gulp.dest(function (file) { 
       return file.base; 
      })) 
      .pipe(rev.manifest({ 
       merge: true 
      })) 
      .pipe(gulp.dest('./')); 
}); 

gulp.task('default', ['js', 'css'], function() { 
}); 

var watcher = gulp.watch([jsArr, cssArr], ['default']); 
watcher.on('change', function (event) { 
    console.log('File ' + event.path + ' was ' + event.type + ', running tasks...'); 
}); 

感謝您的幫助。

Answer 1

我做了一些測試，並且能夠通過包裝watcher.on('change在吞嚥任務中工作。它將不得不在一個吞嚥任務，以稱之爲。

gulp.task('watch', function() { 

    var watcher = gulp.watch([jsArr, cssArr], ['default']); 

    watcher.on('change', function (event) { 
     console.log('File ' + event.path + ' was ' + event.type + ', running tasks...'); 
    }); 

}); 

如果您願意，也可以這樣設置。這將監視js和css任務彼此分開。

gulp.task('watch', function() { 
    gulp.watch(jsArr, ['js']); 
    gulp.watch(cssArr, ['css']); 
}); 

而且，你要刪除pipe(watch(jsArr))和pipe(watch(cssArr))。我不確定是否可以用這種方式使用吞嚥手錶，因爲我從來沒有用過這種方式，但是當運行gulp watch時，它會導致任務掛起而不完成。

要啓動gulp手錶，請在您的終端中運行gulp watch。