Обнаружение изменений между несколькими исходными файлами с помощью Gulp
Первоначальная проблема, с которой я столкнулся, заключалась в том, что задача выполнялась x раз для количества файлов, существующих внутри src.pages
Я исправил это, добавив плагин "изменен на месте", чтобы сравнить дату последнего изменения исходных файлов. Это означало, что если измененная дата не изменилась, то не запустилась или изменилась, то запустится, но только необходимое количество раз.
Поскольку плагин проверяет файлы только по каталогу, переданному в поток, это означает, что он не проверяет файлы внутри src.templates
, которая по сути является моей.html частичной папкой файлов. Обходной путь, который я использовал, состоял в том, чтобы иметь отдельную задачу, отслеживающую частичные изменения файлов, но не запускать какие-либо функции сравнения, это означало, что у меня все еще была первоначальная проблема, связанная с многократным выполнением задачи.
Обновлено: вот урезанная версия моего файла gulpfile, содержащая все, что имеет отношение к моему вопросу:
var fileFormat = 'html',
fileExt = '.' + fileFormat;
var src = {
pages: 'src/pages/**/*' + fileExt,
templates: 'src/templates/**/*' + fileExt,
};
var dist = {
pages: './',
css: './',
};
var config = {
templates: ['src/templates/', 'src/partials/'],
pagesWatch: './*' + fileExt, // Directory where pages are output
};
// Browser Sync with code/HTML injection
function bs() {
browserSync.use(htmlInjector, {
files: dist.pages + '*' + fileExt
});
browserSync.init({
server: dist.pages,
files: dist.css + '*.css',
watchOptions: {
awaitWriteFinish: {
stabilityThreshold: 500
}
}
});
}
function nunjucksPages() {
nunjucksRender.nunjucks.configure([src.templates]);
return gulp.src([src.pages])
.pipe(changedInPlace())
.pipe(nunjucksRender({
path: config.templates,
ext: fileExt
}))
.pipe(gulp.dest(dist.pages))
}
// Use CommonJS 'exports' module notation to declare tasks
exports.nunjucksPages = nunjucksPages;
exports.bs = bs;
function watch() {
gulp.watch([src.pages, src.templates], gulp.series(nunjucksPages));
gulp.watch(config.pagesWatch, gulp.series(htmlInjector));
}
// Runs all the required tasks, launches browser sync, and watches for changes
var build = gulp.series(clean, gulp.parallel(nunjucksPages));
var run = gulp.parallel(bs, watch);
gulp.task('default', gulp.series(build, run));
Изменить для уточнения: у меня есть задача, чтобы посмотреть каталог страниц и шаблонов на предмет изменений, как только он это сделает, он запускает nunjucksPages
функция. После того, как HTML скомпилирован nunjucks, браузерная синхронизация обнаружит это и вставит HTML (вторая задача просмотра в моем коде).
Текущий обходной путь, который у меня есть, состоит в том, чтобы дублировать обе функции nunjucks и запускать их независимо - функции страниц с кэшированием (одиночная перезагрузка, исправлена ошибка!), А шаблоны - без кэширования (перезагрузка на количество страниц X),
Связанная проблема и комментарий: https://github.com/carlosl/gulp-nunjucks-render/issues/47