Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Gulp error: watch task has to be a function

People also ask

What is gulp watch command?

Advertisements. The Watch method is used to monitor your source files. When any changes to the source file is made, the watch will run an appropriate task. You can use the 'default' task to watch for changes to HTML, CSS, and JavaScript files.

How do you exit a gulp watch?

Gulp is just running as a never ending process. The way to abort a process is Ctrl + C .

How do you signal async completion gulp?

To indicate to gulp that an error occurred in a task using an error-first callback, call it with an Error as the only argument. However, you'll often pass this callback to another API instead of calling it yourself.


In gulp 3.x you could just pass the name of a task to gulp.watch() like this:

gulp.task('watch', function() {
  gulp.watch('app/css/*.css', ['styles']);
  gulp.watch('app/js/*.js', ['scripts']);
  gulp.watch('app/img/*', ['images']);
});

In gulp 4.x this is no longer the case. You have to pass a function. The customary way of doing this in gulp 4.x is to pass a gulp.series() invocation with only one task name. This returns a function that only executes the specified task:

gulp.task('watch', function() {
  gulp.watch('app/css/*.css', gulp.series('styles'));
  gulp.watch('app/js/*.js', gulp.series('scripts'));
  gulp.watch('app/img/*', gulp.series('images'));
});

GULP-V4.0

It is a bit late to answer this right now but still. I was stuck in this problem as well and this is how I got it working. Gulp structure

In detail analysis what I was doing wrong

  1. I forgot to call the reload function when the watch noticed some changes in my html files.
  2. Since fireUp and KeepWatching are blocking. They need to be started in parallel rather than serially. So I used the parallel function in the variable run.

thanks for all

gulp.task('watch', function(){
    gulp.watch('app/sass/**/*.sass', gulp.series('sass'));
});

for version gulp 4.xx


It worked for me in Gulp 4.0

gulp.task('watch', function() {
      gulp.watch('src/images/*.png', gulp.series('images'));
      gulp.watch('src/js/*.js', gulp.series('js'));
      gulp.watch('src/scss/*.scss', gulp.series('css'));
      gulp.watch('src/html/*.html', gulp.series('html'));
});