Gulps gulp.watch nicht für neue oder gelöschte Dateien ausgelöst?

Die folgende Gulpjs-Aufgabe funktioniert einwandfrei, wenn Sie Dateien in der Glob-Übereinstimmung bearbeiten:

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

Es funktioniert jedoch nicht (es wird nicht ausgelöst) für neue oder gelöschte Dateien. Fehlt mir etwas?

EDIT : Selbst mit dem Grunt-Watch-Plugin scheint es nicht zu funktionieren:

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 : Gelöst, es war dieses Problem . Globs, die mit ./(das war der Wert von src) beginnen, scheinen nicht am Geldautomaten zu funktionieren.

Bearbeiten: Funktioniert anscheinend gulp.watchjetzt mit neuen oder gelöschten Dateien. Es war nicht so, als die Frage gestellt wurde.

Der Rest meiner Antwort bleibt bestehen: gulp-watchist normalerweise eine bessere Lösung, da Sie damit bestimmte Aktionen nur für die geänderten Dateien ausführen können, während gulp.watchSie nur vollständige Aufgaben ausführen können. Für ein Projekt von angemessener Größe wird dies schnell zu langsam, um nützlich zu sein.

Ihnen fehlt nichts. gulp.watchfunktioniert nicht mit neuen oder gelöschten Dateien. Es ist eine einfache Lösung für einfache Projekte.

Verwenden Sie das gulp-watchPlugin , das viel leistungsfähiger ist, damit Dateien nach neuen Dateien gesucht werden können. Die Verwendung sieht folgendermaßen aus:

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

Persönlich empfehle ich die erste Option. Dies ermöglicht viel schnellere Prozesse pro Datei. Es funktioniert hervorragend während der Entwicklung mit Livereload, solange Sie keine Dateien verketten.

Sie können Ihre Streams entweder über meine lazypipeBibliothek oder einfach über eine Funktion und stream-combinerwie folgt abschließen:

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

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

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

UPDATE 15. Oktober 2014

Wie von @pkyeck unten ausgeführt, hat anscheinend die Version 1.0 gulp-watchdas Format geringfügig geändert, sodass die obigen Beispiele nun lauten sollten:

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

und

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

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

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

Beides gulp.watch()und require('gulp-watch')()wird für neue / gelöschte Dateien ausgelöst, jedoch nicht, wenn Sie absolute Verzeichnisse verwenden. In meinen Tests habe ich übrigens nicht "./"für relative Verzeichnisse verwendet.

Beide werden jedoch nicht ausgelöst, wenn ganze Verzeichnisse gelöscht werden.

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

Wenn srces sich um einen absoluten Pfad handelt (beginnend mit /), erkennt Ihr Code keine neuen oder gelöschten Dateien. Es gibt jedoch noch einen Weg:

Anstatt:

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

schreiben:

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

und es wird funktionieren!

Für Globs muss ein separates Basisverzeichnis angegeben werden, und dieser Basisverzeichnis darf nicht im Glob selbst angegeben werden.

Wenn Sie haben lib/*.js, wird es unter dem aktuellen Arbeitsverzeichnis angezeigtprocess.cwd()

Gulp verwendet Gaze zum Überwachen von Dateien. Im Gulp-API-Dokument sehen wir, dass wir Gaze-spezifische Optionen an die Überwachungsfunktion übergeben können:gulp.watch(glob[, opts], tasks)

Jetzt können wir im Gaze-Dokument feststellen, dass das aktuelle Arbeitsverzeichnis (glob base dir) die cwdOption ist.

Was uns zu Alexks Antwort führt: gulp.watch('js/**/*.js', {cwd: src}, ['scripts']);

Ich weiß, dass dies eine ältere Frage ist, aber ich dachte, ich würde die Lösung werfen, die ich mir ausgedacht habe. Keines der gefundenen gulp-Plugins würde mich über neue oder umbenannte Dateien informieren. Also habe ich Monokel in eine Convenience-Funktion eingewickelt.

Hier ist ein Beispiel für die Verwendung dieser Funktion:

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

Ich sollte beachten, dass gulpStart auch eine von mir erstellte Komfortfunktion ist.

Und hier ist das eigentliche Uhrenmodul.

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

Ziemlich einfach, oder? Das Ganze finden Sie in meinem Gulp Starter Kit: https://github.com/chrisdavies/gulp_starter_kit

Es ist wichtig zu beachten, dass gulp.watch anscheinend nur geänderte und gelöschte Dateien unter Windows meldet, aber unter OSX standardmäßig auf neue und gelöschte Dateien wartet:

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

Sie sollten 'gulp-watch' für neue / umbenannte / gelöschte Dateien anstelle von gulp.watch verwenden

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