Gulp Changed не работает

Я ранее использовал глоток, измененный с моим JS без проблем. Однако сейчас я пытаюсь использовать gulp-changed а также gulp-newer на моем scss файлы без него, обнаружив, какой файл был изменен.

var changed    = require('gulp-changed');
var newer = require('gulp-newer');
var SRC = './stylesheets/**/*.scss';
var DEST = './stylesheets';

gulp.task('sass', function () {   
    return gulp.src(SRC)
        .pipe(changed(DEST)) //tried newer here as well 
        .pipe(sass())
        .pipe(gulp.dest(DEST))
});

При изменении файла scss он выдаст изменения, но не изменит scss

[BS] Watching files...
[09:26:13] Starting 'sass'...
[09:26:14] Finished 'sass' after 180 ms

Часы

gulp.task('watch', ['setWatch', 'browserSync'], function () {
    gulp.watch('./stylesheets/**/*.scss', ['sass']);
});

Ожидаемый выходной файл существует и не изменялся со вчерашнего дня.

Как я могу получить scss для компиляции только измененных файлов.

1 ответ

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

Это требует gulp-cached (который я уже использовал, но я не мог получить gulp-changed или же gulp-newer работать тоже). Первоначально я пытался кэшировать в начале моего конвейера компиляции, например, как changed|newer (должны?) работать, но это тоже не удалось. Через минуту я осознал свою очевидную ошибку: операции кэширования должны выполняться после того, как все файлы обработки и вывода готовы для записи в каталог назначения, но прямо перед тем, как это действительно произойдет.

Ergo:

gulp.watch('path/to/**/*.scss')
    .pipe(sass())
    <<... rename, minify, etc ...>>
    .pipe(cached('sass_compile'))
    .pipe(gulp.dest('path/to/dest/'));

Вот и все. Кеш пуст при запуске процесса Gulp, поэтому все файлы Sass компилируются, их скомпилированные версии (CSS) добавляются в кеш, а затем записываются на диск.

Затем, когда вы редактируете и сохраняете файл SCSS, Sass снова перекомпилирует все, что соответствует глобусу src, но если содержимое совпадает (попадание в кэш), то в SCSS были изменены только пробелы или форматирование, и вызов gulp.dest не бывает Если версия в кэше отличается (отсутствует), содержимое записывается на диск.

Другие вопросы по тегам