How to watch files in gulp?

Question

I'm taking an outdated course in web development and I got stuck related to gulp. What I'm trying to figure out is how to watch files using gulp watch. I got an error message whenever I hit "gulp watch" in my command. Can anyone knows how to fix this? Here is my gulpfile.js code:

<pre>
var gulp = require('gulp'),
watch = require('gulp-watch');

gulp.task('default', function() {
  console.log("This is a gulp task");
});

gulp.task('html', function() {
  console.log("This is your HTML");
});

gulp.task('styles', function() {
  console.log("This is for your css/sass/postcss`enter code here`");
});

gulp.task('watch', function() {

  watch('./app/index.html', function() {
    gulp.start('html');
  });

  watch('./app/assets/styles/**/*.css', function() {
    gulp.start('styles');
  });

});
</pre>

Here is the error message:

(node:7812) UnhandledPromiseRejectionWarning: TypeError: gulp.start is not a function
(node:7812) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:7812) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Welcome to SO - including the error-message would be helpful :) — eol, Aug 15 '20 at 11:29
Maybe this will help you: https://stackoverflow.com/questions/54264993/glup-v4-0-0-gulp-start-is-not-a-function — eol, Aug 15 '20 at 12:07

score 0 · Accepted Answer · answered Aug 17 '20 at 14:30

Since gulp.start has been deprecated since v4 and you're using this version of Gulp you may want to try gulp.series instead:

gulp.task('watch', gulp.series('styles', 'html',  function(done) {
    gulp.watch('./app/assets/styles/**/*.css', gulp.series('styles'));
    gulp.watch('./app/index.html', gulp.series('html'));
    done();
}));

How to watch files in gulp?

1 Answers1