Search code examples
sassgulpwatchgulp-sass

How can I fix gulp watch not watching files

I'm using gulp to watch file changes and compile my scss, But watch isn't tracking the file changes.

im using gulp-sass and the version is 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);
Solution

  • Try:

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

    cb is a callback function - just leave it as cb (it doesn't need to exist anywhere else) and is called last in the task.