Gulp 4 - смотреть, не наблюдая за изменениями

Question

Gulp 4 - смотреть, не наблюдая за изменениями

1

Сегодня я перешел на Gulp 4, но у меня не получается заставить работать функцию часов.

// Watch
gulp.task('watch', gulp.series('typescript', 'sass', 'browserSync', function(){
  gulp.watch('./app/styles/**/*.scss', gulp.series('sass'));
  gulp.watch('app/scripts/**/*.ts', gulp.series('typescript'));
  gulp.watch('./app/*.html', browserSync.reload);
}));

typescript, sass, browserSync запустится, но watch не реагирует на изменения файла.

Martin Hetfield Mali 07 янв. 2018, в 17:56

Источник

2

Помог мне: API - Просмотр файлов
vsync 17 дек. 2018, в 14:06
0

@vsync Это, кажется, ключ к моей проблеме прямо сейчас, но как мне ее реализовать? Что такое cb в примере API function css(cb) { // body omitted cb(); ? }
YCode 13 фев. 2019, в 16:04
0

Эта статья объясняет cb и другие связанные вопросы.
YCode 13 фев. 2019, в 19:46

Показать ещё 1 комментарий

Теги:

javascript

gulp

gulp-watch

2 ответа

Ещё вопросы

@vsync Это, кажется, ключ к моей проблеме прямо сейчас, но как мне ее реализовать? Что такое cb в примере API function css(cb) { // body omitted cb(); ? }
Эта статья объясняет cb и другие связанные вопросы.

Weft · Answer 1 · 2018-12-17T13-45-00.000Z

У меня просто была такая же проблема. На самом деле у вас нет ссылки на инициализированный browserSync внутри вашей задачи watch глотком. Вместо того, чтобы ваше browserSync.init функции в отдельной browserSync задачи глотка, переместить его внутри watch задачи, и она должна работать. Надеюсь это поможет!

Пример:

gulp.task('watch', gulp.series(function (){
browserSync.init({
    proxy:"http://localhost:8888",
    injectChanges: true,
    plugins: ["bs-html-injector?files[]=*.html"]
});
var html = gulp.watch('development/index.html');
html.on('change', function(path, stats) {
          console.log('you changed the html');
          browserSync.notify("Compiling, please wait!");
          browserSync.reload("index.html");
})
var js = gulp.watch('development/**/*.js');
js.on('change', function(path, stats) {
          console.log('you changed the js');
          browserSync.notify("Compiling, please wait!");
          browserSync.reload();
})
var css = gulp.watch('development/**/*.css');
css.on('change', function(path, stats) {
          console.log('you changed the css');
          browserSync.notify("Injecting CSS!");
          browserSync.reload("*.css");
})
}));

Это может быть полезно, если вы поместите здесь фактические вызовы задачи компиляции для ясности / завершения, другими словами, ваш пример наблюдает, но ничего не делает :)

Remario · Answer 2 · 2018-01-07T14-15-00.000Z

Измените gulp.watch('app/scripts/**/*.ts', gulp.series('typescript')); к абсолютному gulp.watch('./app/scripts/**/*.ts', gulp.series('typescript'));

Также я обычно придерживаюсь этого синтаксиса для каждой задачи.

var watcher = gulp.watch('js/**/*.js', gulp.parallel('concat', 'uglify'));
watcher.on('change', function(path, stats) {
  console.log('File ' + path + ' was changed');
});

Это отсутствует, потому что я искал проблему в путях. Не помогает.
Его более явное всегда работает для меня, параллель не является необходимым изменением серии в вашем случае