Почему gulp-pug не обновляется?

Question

[Артур Карапетян]

Здравствуйте!
После долгих скитаний по всяким Vue/Angular cli мне пришлось вернуться к Gulp. Проблема в том, что при изменении вложенных .pug файлов в папке pug не срабатывает перезагрузка (pug компилится в html, проблема именно в перезагрузке)

Структура папок:

Соответственно компилироваться должны только .pug файлы из корня, изменения наблюдаться у всех файлов

Нынешний конфиг

var syntax = "scss";

gulp.task("browser-sync", function() {
  browserSync({
    server: {
      baseDir: "app"
    },
    notify: false,
    open: false
  });
});

gulp.task("pug", function() {
  gulp
    .src("app/pug/*.pug")
    .pipe(
      pug({
        doctype: "html",
        pretty: true
      })
    )
    .pipe(gulp.dest("app/"))
    .pipe(browserSync.stream());
});

gulp.task("watch", function() {
  gulp.watch("app/pug/*.pug", gulp.parallel("pug"));
});

gulp.task(
  "default",
  gulp.parallel("pug", "styles", "browser-sync", "watch")
);

Comments

[WapSter]

Советую перейти на вебпак, он отслеживает зависимости, да и настраивать его специфично под проект, намного проще. Правда с первой сборкой придется повозиться.

Answer 1

[Андрей Dobrin]

Предлагаю сделать так:

var browserSync  = require('browser-sync').create()
var bsConfig = {
		server: {
			baseDir: 'app'
		},
		notify: false,
		open: false
	}; 

gulp.task('watch', function(){
	browserSync.init(bsConfig);
	gulp.watch("app/pug/*.pug", gulp.parallel("pug"));
})

Watcher предлагаю использовать таким способом)