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。