Как заставить gulp записывать все файлы одновременно?

Question

У меня есть большое задание, которое опровергает все мои шаблоны мопса (с включает в себя):

gulp.task('processMarkup', function(){
    return gulp.src('src/*.pug')
        .pipe(pug())
        .pipe(gulp.dest('./dist/'));
});

У меня также есть наблюдатель, который выполняет эту задачу:

gulp.task('watch-markup',function(){
    gulp.watch(['./src/**/*.pug'], gulp.series('processMarkup'));
});

В настоящее время у меня есть 5 шаблонов мопса внутри src/ и каждый раз, когда мопс пишет файлы dist/ (обычно это занимает 2-5 с) ​​мой live-reload, который наблюдает dist/ вызывает перезагрузку браузера, поэтому мне нужно смотреть через 5 перезагрузок браузера.

Я думаю, что это можно предотвратить, если все файлы сохраняются одновременно. Как это может быть достигнуто? (или если у вас есть лучшие решения, предложите их).

PS Live Обновить, что я использую https://github.com/tapio/live-server.

Answer 1

Согласно комментарию @Sean, я сделал эту конфигурацию:

let gulp = require('gulp');
let pug = require('gulp-pug');
let browserSync = require('browser-sync');

gulp.task('reload', function(done) {
  browserSync.reload();
  done();
});

gulp.task('processMarkup', function() {
  return gulp.src('src/*.pug')
    .pipe(pug())
    .pipe(gulp.dest('./dist/'));
});

gulp.task('serve', function() {
  browserSync.init({
    server: './dist/'
  });
  gulp.watch(['./src/**/*.pug'], gulp.series('processMarkup', 'reload'));
});

Теперь все работает правильно.