Gulps gulp.watch没有触发新的或删除的文件？

Question

在glob匹配中编辑文件时,以下Gulpjs任务正常工作:

// watch task.
gulp.task('watch', ['build'], function () {
    gulp.watch(src + '/js/**/*.js', ['scripts']);
    gulp.watch(src + '/img//**/*.{jpg,jpeg,png,gif}', ['copy:images']);
    gulp.watch(src + '/less/*.less', ['styles']);
    gulp.watch(src + '/templates/**/*.{swig,json}', ['html']);
});

// build task.
gulp.task('build', ['clean'], function() {
    return gulp.start('copy', 'scripts', 'less', 'htmlmin');
});

但是,对于新文件或已删除文件,它不起作用(它不会被触发).有什么我想念的吗？

编辑:即使使用grunt-watch插件,它似乎无法正常工作:

gulp.task('scripts', function() {
    return streamqueue(
        { objectMode: true },
        gulp.src([
            vendor + '/jquery/dist/jquery.min.js',
            vendor + '/bootstrap/dist/js/bootstrap.min.js'
        ]),
        gulp.src([
            src + '/js/**/*.js'
        ]).pipe(plugins.uglify())
    )
    .pipe(plugins.concat(pkg.name + '.min.js'))
    .pipe(gulp.dest(dest + '/js/'));
});

gulp.task('watch', ['build'], function () {
    plugins.watch({glob: src + '/js/**/*.js'}, function () {
        gulp.start('scripts');
    });
});

编辑:解决了,就是这个问题.以./(也就是价值src)开头的Glob 似乎不适用于ATM.

Answer 1

编辑:显然gulp.watch现在可以使用新文件或已删除文件.当问到这个问题时,它没有.

我的其余部分仍然存在:gulp-watch通常是一个更好的解决方案,因为它只允许您对已修改的文件执行特定操作,而gulp.watch只允许您运行完整的任务.对于合理大小的项目,这将很快变得太慢而无法使用.

你没有遗漏任何东西.gulp.watch不适用于新文件或已删除的文件.这是一个为简单项目设计的简单解决方案.

要查看可以查找新文件的文件,请使用更强大的gulp-watch插件.用法如下:

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

// in a task
watch({glob: <<glob or array of globs>> })
        .pipe( << add per-file tasks here>> );

// if you'd rather rerun the whole task, you can do this:
watch({glob: <<glob or array of globs>>}, function() {
    gulp.start( <<task name>> );
});

我个人推荐第一个选项.这允许更快的每文件进程.只要您没有连接任何文件,它在开发期间使用livereload非常有用.

您可以使用我的lazypipe库或简单地使用函数来包装您的流,stream-combiner如下所示:

var combine = require('stream-combiner');

function scriptsPipeline() {
    return combine(coffeeescript(), uglify(), gulp.dest('/path/to/dest'));
}

watch({glob: 'src/scripts/**/*.js' })
        .pipe(scriptsPipeline());

更新 2014年10月15日

正如下面的@pkyeck所指出的,显然1.0版本gulp-watch稍微改变了格式,所以上面的例子现在应该是:

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

// in a task
watch(<<glob or array of globs>>)
        .pipe( << add per-file tasks here>> );

// if you'd rather rerun the whole task, you can do this:
watch(<<glob or array of globs>>, function() {
    gulp.start( <<task name>> );
});

和

var combine = require('stream-combiner');

function scriptsPipeline() {
    return combine(coffeeescript(), uglify(), gulp.dest('/path/to/dest'));
}

watch('src/scripts/**/*.js')
        .pipe(scriptsPipeline());

Answer 2

双方gulp.watch()并require('gulp-watch')()会触发但是如果你不使用绝对目录新增/删除的文件.在我的测试中,我没有使用"./"相关目录BTW.

如果删除整个目录,则两者都不会触发.

   var watch = require('gulp-watch');
   //Wont work for new files until gaze is fixed if using absolute dirs. It  won't trigger if whole directories are deleted though.
   //gulp.watch(config.localDeploy.path + '/reports/**/*', function (event) {

   //gulp.watch('src/app1/reports/**/*', function (event) {
   // console.log('*************************** Event received in gulp.watch');
   // console.log(event);
   // gulp.start('localDeployApp');
   });

   //Won't work for new files until gaze is fixed if using absolute dirs. It  won't trigger if whole directories are deleted though. See https://github.com/floatdrop/gulp-watch/issues/104
   //watch(config.localDeploy.path + '/reports/**/*', function() {

   watch('src/krfs-app/reports/**/*', function(event) {
      console.log("watch triggered");
      console.log(event);
      gulp.start('localDeployApp');
   //});

Answer 3

如果src是绝对路径(以...开头/),则代码不会检测新文件或已删除文件.然而,还有一种方法:

代替:

gulp.watch(src + '/js/**/*.js', ['scripts']);

写:

gulp.watch('js/**/*.js', {cwd: src}, ['scripts']);

它会工作!

Answer 4

Globs必须指定一个单独的基目录,并且不能在glob本身中指定基本位置.

如果你有lib/*.js,那么它将在当前正在工作的目录下看process.cwd()

Gulp使用Gaze来观看文件,在Gulp API文档中我们看到我们可以将Gaze特定选项传递给watch函数:gulp.watch(glob[, opts], tasks)

现在在Gaze doc中我们可以发现当前工作目录(glob base dir)是cwd可选的.

这引出了我们对alexk的回答: gulp.watch('js/**/*.js', {cwd: src}, ['scripts']);