Search code examples
javascriptgulpgulp-watch

Can't get Gulp to watch two files


I am trying to watch Sass files and jade files for change. Both gulp.watch methods work on their own but not together?

gulp.task('compile', function() {
  gulp.watch('src/assets/sass/*.sass', ['sass']);
  gulp.watch('src/*.jade', ['jade']);
});

Solution

  • When i had mine setup i would have something like

    gulp.task('watchSass', function() {
      gulp.watch('src/assets/sass/*.sass', ['sass']);
    });
    
    gulp.task('watchJade', function() {
      gulp.watch('src/*.jade', ['jade']);
    });
    
    gulp.task('compile',['watchSass', 'watchJade']);
    

    I think it is to do with the fact that the gulp task dependencies are run asynchronously, where the two watch statements in your single task are run sequentially so the first watch statement blocks the second watch statement from being reached.