Синхронизация браузера, перезагрузка скриптов и стилей не работает при переходе с gulp 3.x на gulp 4.x

Я пытаюсь обновить gulp с 3.x до 4.x. При использовании gulp watch стили, скрипты и функция вставки работают хорошо, но когда я вношу какие-либо изменения в файл, скрипты и стили должны загружаться автоматически. Это не работает.

Я пробовал добавлять gulp.series к каждой функции.

    function isOnlyChange(event) {
      return event.type === 'changed';
      }

   gulp.watch([
     path.join(conf.paths.src, '/app/**/*.css'),
     path.join(conf.paths.src, '/app/**/*.scss')
    ], gulp.series(function (event) {
        if (isOnlyChange(event)) {
          gulp.series('styles-reload');
       } else {
         gulp.series('inject-reload');
       }
   }));

Gulp watch необходимо перезагрузить стили, когда я вношу изменения в файл стилей, но это не работает. Может ли кто-нибудь помочь мне, как выполнить в gulp 4.x


gulp gulp-browser-sync gulp-watch
person Ragini    schedule 21.10.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете попробовать что-то вроде этого:

function myWatch() {

  gulp.watch(['./scss/*.scss'], { events: 'change' }, function (cb) {
    console.log("here 1");
    // gulp.series('styles-reload');
    cb();
  });

  gulp.watch(['./scss/*.scss'], { events: ['add', 'addDir', 'unlink', 'unlinkDir', 'ready', 'error'] }, function (cb) {
    console.log("here 2");
    // gulp.series('inject-reload');
    cb();
  });
}

См. https://gulpjs.com/docs/en/api/watch#options, чтобы увидеть описание событий, которое вы можете включить во второй gulp.watch.

person Mark    schedule 23.10.2019
comment
Проблема в том, что для меня browserSync при событии изменения не работает. - person Ragini; 24.10.2019
comment
Затем вам нужно отредактировать свой вопрос, чтобы также отобразить код browserSync. И задачи styles-reload и inject-reload. - person Mark; 24.10.2019
comment
Я прикреплю сюда функции styles-reload, inject-reload. - person Ragini; 24.10.2019