Gulps gulp.watch tidak terpicu untuk file baru atau yang dihapus?

Tugas Gulpjs berikut berfungsi dengan baik saat mengedit file di pencocokan glob:

// 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');
});

Namun tidak berfungsi (tidak terpicu) untuk file baru atau yang dihapus. Apakah ada sesuatu yang saya lewatkan?

EDIT : bahkan menggunakan plugin grunt-watch sepertinya tidak berfungsi:

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');
    });
});

EDIT : Dipecahkan, itu adalah masalah ini . Gumpalan dimulai dengan ./(itu nilai src) sepertinya tidak berfungsi ATM.

Sunting: Tampaknya gulp.watchtidak berfungsi dengan file baru atau yang dihapus sekarang. Tidak ketika pertanyaan diajukan.

Sisa jawaban saya masih tetap: gulp-watchbiasanya merupakan solusi yang lebih baik karena memungkinkan Anda melakukan tindakan spesifik hanya pada file yang telah dimodifikasi, sementara gulp.watchhanya memungkinkan Anda menjalankan tugas lengkap. Untuk proyek dengan ukuran yang masuk akal, ini dengan cepat akan menjadi terlalu lambat untuk berguna.

Anda tidak melewatkan apa pun. gulp.watchtidak berfungsi dengan file baru atau yang dihapus. Ini adalah solusi sederhana yang dirancang untuk proyek-proyek sederhana.

Untuk mendapatkan file menonton yang dapat mencari file baru, gunakan yang gulp-watchPlugin , yang jauh lebih kuat. Penggunaannya terlihat seperti ini:

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>> );
});

Secara pribadi, saya merekomendasikan opsi pertama. Ini memungkinkan proses per file yang jauh lebih cepat. Ini bekerja sangat baik selama pengembangan dengan memuat hati selama Anda tidak menggabungkan file apa pun.

Anda dapat membungkus aliran Anda menggunakan perpustakaan sayalazypipe , atau cukup menggunakan fungsi dan stream-combinerseperti ini:

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

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

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

PEMBARUAN 15 Oktober 2014

Seperti yang ditunjukkan oleh @pkyeck di bawah ini, ternyata rilis versi 1.0 gulp-watchsedikit mengubah formatnya, jadi contoh di atas seharusnya menjadi:

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>> );
});

dan

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

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

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

Keduanya gulp.watch()dan require('gulp-watch')()akan memicu untuk file baru / dihapus tetapi tidak jika Anda menggunakan direktori absolut. Dalam tes saya, saya tidak menggunakan "./"untuk direktori relatif BTW.

Keduanya tidak akan memicu jika seluruh direktori dihapus.

   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');
   //});

Jika srcjalur absolut (dimulai dengan /), kode Anda tidak akan mendeteksi file baru atau yang dihapus. Namun masih ada jalan:

Dari pada:

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

menulis:

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

dan itu akan berhasil!

Glob harus memiliki direktori basis terpisah yang ditentukan dan lokasi basis itu tidak boleh ditentukan dalam glob itu sendiri.

Jika sudah lib/*.js, itu akan terlihat di bawah direktori kerja saat iniprocess.cwd()

Gulp menggunakan Gaze untuk menonton file dan dalam dokumen Gulp API kami melihat bahwa kami dapat meneruskan opsi spesifik Gaze ke fungsi arloji:gulp.watch(glob[, opts], tasks)

Sekarang dalam dokumen Gaze kita dapat menemukan bahwa dir yang berfungsi saat ini (glob base dir) adalah cwdopsi.

Yang mengarahkan kita ke jawaban alexk: gulp.watch('js/**/*.js', {cwd: src}, ['scripts']);

Saya tahu ini adalah pertanyaan yang lebih tua, tetapi saya pikir saya akan memberikan solusi yang saya temukan. Tidak ada plugin gulp yang saya temukan akan memberi tahu saya tentang file baru atau yang diganti nama. Jadi saya akhirnya membungkus kacamata berlensa dalam fungsi kenyamanan.

Berikut ini contoh bagaimana fungsi itu digunakan:

watch({
    root: config.src.root,
    match: [{
      when: 'js/**',
      then: gulpStart('js')
    }, {
      when: '+(scss|css)/**',
      then: gulpStart('css')
    }, {
      when: '+(fonts|img)/**',
      then: gulpStart('assets')
    }, {
      when: '*.+(html|ejs)',
      then: gulpStart('html')
    }]
  });

Saya harus mencatat bahwa gulpStart juga merupakan fungsi kenyamanan yang saya buat.

Dan di sini adalah modul arloji yang sebenarnya.

module.exports = function (options) {
  var path = require('path'),
      monocle = require('monocle'),
      minimatch = require('minimatch');

  var fullRoot = path.resolve(options.root);

  function onFileChange (e) {
    var relativePath = path.relative(fullRoot, e.fullPath);

    options.match.some(function (match) {
      var isMatch = minimatch(relativePath, match.when);
      isMatch && match.then();
      return isMatch;
    });
  }

  monocle().watchDirectory({
    root: options.root,
    listener: onFileChange
  });
};

Cukup sederhana, bukan? Semuanya dapat ditemukan di starter kit gulp saya: https://github.com/chrisdavies/gulp_starter_kit

Penting untuk dicatat bahwa sepertinya gulp.watch hanya melaporkan file yang diubah dan dihapus pada Windows tetapi mendengarkan file baru dan yang dihapus secara default di OSX:

https://github.com/gulpjs/gulp/issues/675

Anda harus menggunakan 'gulp-watch' untuk file baru / yang diubah namanya / dihapus alih-alih gulp.watch

var gulpwatch = require('gulp-watch');
var source = './assets',  
destination = './dest';
gulp.task('copy-changed-assets', function() {
    gulpwatch(source+'/**/*', function(obj){
        gulp.src( obj.path, { "base": source})
        .pipe(gulp.dest(destination));
    });
});