2016-06-28 2 views
0

У меня есть сайт Jekyll, который является частью проекта Gulp, используя BrowserSync для предварительного просмотра сайта по мере его создания. Один из моих операторов watch ищет изменения для html, чтобы автоматически обновлять сайт.Перезагрузка BrowserSync только один раз при использовании Jekyll in Gulp при обновлении общего файла

gulp.watch('docs/_site/**/*.html').on('change', browserSync.reload); 

Работы, как конструировано.

Однако, когда я обновляю header.html (или любой другой общий файл) браузер обновляется множественными раз, потому что все страниц изменились. Это имеет смысл, поскольку все статические страницы обновляются. Но я хотел бы предотвратить это при обновлении общего файла.

Есть ли способ, который я могу сказать Gulp/BrowserSync, чтобы обновлять только один раз, когда обновляется общий файл Jekyll?

UPDATE

Мои часы набор выглядит следующим образом:

gulp.task('dev:watch', ['browserSync', 'docs:sass', 'docs:lib', 'docs:build'], function() { 
    gulp.watch(['scss/**/*.scss', 'docs/assets/**/*.scss'], ['dev:sass']); 
    gulp.watch(['docs/**/*.html', 'docs/**/*.md', '!docs/_site/**'], ['docs:build']); 
    gulp.watch('docs/_site/**/*.html').on('change', browserSync.reload); 
}); 

docs:build задача:

gulp.task('docs:build', function() { 
    browserSync.notify('Building Jekyll'); 
    return spawn('jekyll', ['build', '--config', '_config.yml,_config_dev.yml', '--incremental'], {stdio: 'inherit'}); 
}); 

ответ

0

# Edit после вопроса редакции:

Изменения в _site являются последствиями dev:sass или docs:build задач, поэтому вы можете позвонить browserSync.reload из этих задач. Затем вы убедитесь, что он добавляет только один раз.

# Конец редактировать

Итак, вы смотрите просматриваемой процесс.

У вас работает jekyll serve, который по умолчанию просматривает любые изменения в корневом каталоге и генерирует поколение для всех файлов, включая файлы «_includes».

Для изменения файла _include у вас может быть 10 страниц + 10 сообщений + 10 элементов коллекции = 30 обновленных страниц в папке _site, что приводит к запуску 30 обновлений gulp.watch.

Лучше смотреть основные Джекил файлы и папки для изменения с:

gulp.watch(
    ['*.html', '*.md', '_includes/*.html', '_layouts/*.html', ...other files], 
    browserSync.reload() 
); 

и даже добавить reload delay, чтобы позволить Джекил занять некоторое время, чтобы восстановить большой сайт и перезагрузки через некоторое время спуска:

browserSync.reload({reloadDelay: 5000}) 
+0

Привет, Дэвид. Я не запускаю «jekyll serve», это просто сайт, основанный на Jekyll (моя формулировка, возможно, вводит в заблуждение). Gulp обрабатывает все компиляции (через процесс «build»), и сайт обслуживается (во время dev) браузером BrowserSync. –

+0

И как происходят изменения в _site? смотреть -> jekyll build? Можем ли мы увидеть ваш код? –

+0

Я обновил свой вопрос с помощью задач 'watch' и' build'. Спасибо! –

Смежные вопросы