gulp-changed filtert nicht geänderte Dateien nicht aus

Question

Ich versuche, gulp-changed zu verwenden, um zeitraubende Aufgaben zu verhindern, die bei unveränderten Dateien auftreten. Meine gulpfile.js hat es Setup wie so:

gulp.task("min:css", function() { 
    return gulp.src([paths.css, "!" + paths.minCss]) 
     .pipe(changed(".")) 
     .pipe(concat(paths.concatCssDest)) 
     .pipe(autoprefixer({ browsers: ['> 5%'] })) //support browsers with >5% market share 
     .pipe(cssmin()) 
     .pipe(gulp.dest(".")); 
}); 

jedoch jedes Mal, wenn ich alles sehen wird ran:

[11:15:02] Starting 'min:js'... 
[11:15:02] Starting 'min:css'... 
[11:15:02] Finished 'min:css' after 79 ms 
Process terminated with code 0. 
[11:15:02] Finished 'min:js' after 121 ms 
[11:15:02] Starting 'min'... 
[11:15:02] Finished 'min' after 12 μs 

Gibt es Gründe, gulp-changed nicht diese unveränderten Dateien filtern?

Answer 1

Zunächst einmal Sie scheinen zu missverstehen, was es ist, dass gulp-changed tatsächlich tut. gulp-changed kann die Ausführung von Tasks nicht verhindern. Das heißt, diese beiden Zeilen:

[11:15:02] Starting 'min:css'... 
[11:15:02] Finished 'min:css' after 79 ms 

in schluck der Protokollausgabe erscheint auch wenn keine einzige CSS-Datei geändert hat. gulp-changed entfernt einfach unveränderte Dateien aus dem Stream, so dass sie später keine pipe() Stufen erreichen. Die Dateien werden noch bis zu dem Punkt verarbeitet, an dem sie changed() erreichen.

(Zufälligerweise habe ich eine Antwort nur gestern, dass auch mit gulp-changed beschäftigt und kontrastiert ihre Funktionsweise mit gulp.watch() und gulp-watch. Might be of interest too.)

Zweitens, wie funktioniert gulp-changed wissen, ob eine Datei geändert hat? Es vergleicht die Quelldateien mit den Zieldateien. Wenn die Zieldateien älter als die Quelldateien sind, müssen sich die Quelldateien geändert haben.

Damit dies funktioniert, muss gulp-changed in der Lage sein, von einer Quelldatei zu einer Zieldatei zu mappen. Sie haben jedoch mehrere Quelldateien und nur eine Zieldatei (Ihre verkettete Datei). Das bedeutet, dass Sie eine benutzerdefinierte hasChanged handler bereitstellen müssen, um von Ihren Quelldateien zu Ihrer Zieldatei zu mappen.

Drittens, auch wenn Sie alles getan haben, konnte Ihre Aufgabe immer noch nicht so funktionieren, wie Sie es wollen. Seit gulp-changed nur lassen Sie diese Dateien durch, die geändert wurden, nur diese Dateien enden in Ihrer verketteten Ausgabedatei.

Angenommen, Sie möchten foo.css und bar.css in all.css verketten. Dies würde beim ersten Mal gut funktionieren. Aber wenn Sie dann ändern bar.css, nurbar.css wird in all.css enden.

Da Sie immer müssen alle Ihre CSS-Dateien als Eingabe, Sie kann nicht Verwendung gulp-changed in Kombination mit gulp-concat.

Dass gesagt wird, wenn Sie Ihre min:css Aufgabe beschleunigen wollen, wenn es von gulp.watch() aufgerufen wird Ihnen die official Gulp.js incremental rebuilding recipe folgen:

gulp.task("min:css", function() { 
    return gulp.src([paths.css, "!" + paths.minCss]) 
    .pipe(cached('cssCache')) 
    .pipe(autoprefixer({ browsers: ['> 5%'] })) 
    .pipe(cssmin()) 
    .pipe(remember('cssCache')) 
    .pipe(concat(paths.concatCssDest)) 
    .pipe(gulp.dest(".")); 
});