Как я могу исправить gulp watch, который не просматривает файлы

Я использую gulp для просмотра изменений файлов и компиляции моего scss, но часы не отслеживают изменения файлов.

я использую gulp-sass и версия 4.0

const { src, dest, watch, series } = require('gulp');
const { sass } = require('gulp-sass');

function compileSass() {
 return src('app/assets/scss/main.scss')
 .pipe(sass())
 .pipe(dest('app/css'));
}

function start() {
  //compile and watch
  watch('app/assets/scss/**/*.scss', { events: 'change' }, function(compileSass) {
    // body omitted
    compileSass();
  });

}

exports.default = series(start);

sass gulp watch gulp-sass

30.04.2019 04:57

Оптимизируйте свой CSS с помощью Gerillass: Библиотека Sass для эффективной стилизации

Если вы планируете стать веб-разработчиком, вы наверняка слышали о CSS - языке, используемом для стилизации HTML-документов. CSS является неотъемлемой...

392

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Не знаю, почему ваша задача не заключена в gulp.task.

Попробуйте вставить этот код в свой gulpfile.js

gulpfile.js

const gulp = require('gulp');
const sass = require('gulp-sass'); // not { sass }

/** Transpile sass/scss to css */
gulp.task('compile-sass', () => {
  return gulp.src('app/assets/scss/main.scss')
    .pipe(sass())
    .pipe(gulp.dest('app/css'));
});

/** Run the compile-sass task then set a watchers to app/assets/scss/**/*.scss */
gulp.task('watch', gulp.series(
  'compile-sass',
  (done) => {
    gulp.watch('app/assets/scss/**/*.scss')
      .on('change', gulp.series('compile-sass'))
    done()
  },
));

/** Default task */
gulp.task('default', gulp.series('watch'));

Теперь вы можете запустить его, используя gulp в своем терминале.

gulp4 не требует использования gulp.task: на самом деле это не рекомендуется.

— 30.04.2019 16:08

30.04.2019 10:49

Ответ принят как подходящий

Пытаться:

function start() {
  //compile and watch
  watch('app/assets/scss/**/*.scss', { events: 'change' }, function(cb) {
    // body omitted
    compileSass();
    cb();
  })
}

cb — это функция обратного вызова — просто оставьте ее как cb (она не должна существовать где-либо еще) и она вызывается последней в задаче.

30.04.2019 16:07