gulp-change не отфильтровывает неизмененные файлы

Question

Я пытаюсь использовать gulp-change, чтобы избежать трудоемких задач, возникающих с неизмененными файлами. Мой gulpfile.js настроен так:

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("."));
});

Однако каждый раз, когда я вижу, все запускается:

[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

По какой-то причине gulp-change не фильтрует эти неизмененные файлы?

Answer 1

Во-первых, вы, кажется, неправильно поняли, что это такое gulp-changed на самом деле gulp-changed не может помешать выполнению задач. Это означает, что эти две строки:

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

появится в выводе журнала gulp, даже если не изменился ни один файл CSS. gulp-changed просто удаляет неизмененные файлы из потока, чтобы они не доходили до pipe() этапы. Файлы все еще обрабатываются до точки, где они достигают changed(),

(По совпадению я написал ответ только вчера, который также имеет дело с gulp-changed и контрастирует с режимом работы gulp.watch() а также gulp-watch, Может быть интересным тоже.)

Во-вторых, как gulp-changed знать, если файл изменился? Он сравнивает исходные файлы с файлами назначения. Если файлы назначения старше, чем исходные файлы, исходные файлы должны быть изменены.

Чтобы это работало, gulp-changed должен быть в состоянии сопоставить исходный файл с конечным файлом. Однако у вас есть несколько исходных файлов и только один конечный файл (ваш объединенный файл). Это означает, что вы должны предоставить hasChanged обработчик для сопоставления ваших исходных файлов с вашим файлом назначения.

В-третьих, даже если вы сделали все это, ваша задача все равно не могла бы работать так, как вы этого хотите. поскольку gulp-changed только давайте эти файлы, которые были изменены, только эти файлы окажутся в вашем объединенном выходном файле.

Скажем, вы хотите объединить foo.css а также bar.css в all.css, Это будет хорошо работать в первый раз. Но если вы потом измените bar.cssтолько bar.css в конечном итоге в all.css,

Поскольку вам всегда нужны все ваши CSS-файлы в качестве входных данных, вы не можете использовать gulp-changed в комбинации с gulp-concat,

Это, как говорится, если вы хотите ускорить свой min:css задача, когда она вызывается из gulp.watch() Вы можете следовать официальному рецепту пошагового восстановления Gulp.js:

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("."));
});