CODEWITHSUNDEEP
gulpgulp-watch
dhrm
dhrm

Reputation: 14944

Gulp Watch only run once

I'm using this Gulp Watch sample: https://github.com/floatdrop/gulp-watch/blob/master/docs/readme.md#starting-tasks-on-events.

var gulp = require('gulp');
var watch = require('gulp-watch');
var batch = require('gulp-batch');

gulp.task('build', function () { console.log('Working!'); });

gulp.task('watch', function () {
    watch('**/*.js', batch(function () {
        gulp.start('build');
    }));
});

When I run it on my Windows 8 machine, it only runs the first time I change a file:

C:\test>gulp watch
[08:40:21] Using gulpfile C:\test\gulpfile.js
[08:40:21] Starting 'watch'...
[08:40:21] Finished 'watch' after 2.69 ms
[08:40:31] Starting 'build'...
Working!
[08:40:31] Finished 'build' after 261 µs

Next time nothing happens. Why?

Upvotes: 31

Views: 15451

Answers (5)

lacostenycoder
lacostenycoder

Reputation: 11226

This appears to be known issue I had the same problem and used the same as ddprrt. The difference was using directory glob (wildcard) as apposed to absolute path.

I changed this:

 gulp.task('watch', function() {
   gulp.watch('sass/shortcutcss/*.scss', ['sass'])
 });

to this:

 gulp.task('watch', function() {
   gulp.watch('sass/**/*.scss', ['sass'])
 });

Upvotes: 9

Nedvajz
Nedvajz

Reputation: 1029

Long story:
For me it did not work for long time. All seems to be set right but run only once.

But suddenly I started with parcel js on another project and same thing happened with their builtn watch. So I looked for the answer and I found out that problem was with my Vim settings.

Answer what helped me is this one from @acobster https://stackoverflow.com/a/55435197/2686510

In short:
Update .vimrc by adding set backupcopy=yes

Upvotes: 0

webwiseguys
webwiseguys

Reputation: 331

For me it was adding a "return" to the task:

gulp.task('styles', function(){
 return gulp.src('css/styles.css')
    .pipe(autoprefixer())
    .pipe(gulp.dest('build'));
});

Upvotes: 23

Sascha
Sascha

Reputation: 635

This problem made me crazy for a weekend. I tried all:

  • Add done()-Event
  • Rename/Touch/Clear target CSS
  • Be more specific with the filepaths

But the (reason for this problem and) the solution was so easy that I felt pathetic after that:

Just update your nodejs installation, mine was 0.12.x! No wonder that this doesn't worked.

After that the watch event works again. Sometimes it goes wrong again, too. But in this cases just save your file a second time and it get recognized. (I think foundation/gulp watch checks for changes to fast and while your file get replaced with the new uploaded one)

Upvotes: 1

ddprrt
ddprrt

Reputation: 7584

If you read the documentation closely, you see the following phrase:

You can pass plain callback, that will be called on every event or wrap it in gulp-batch to run it once

So, that's basically the deal with gulp-batch. To constantly watch it, just remove the batch call:

gulp.task('build', function (done) { 
    console.log('Working!'); 
    done();
});

gulp.task('watch', function () {
    watch('app/*.js', function () {
        gulp.start('build');
    });
});

(and add the 'done' callback to build to let Gulp know when you're finished).

Btw... I'm not sure, but I think gulp-watch is meant to not only watch files, but also directly returning a vinyl object. So actually using the built-in gulp.watch should have the same effect:

gulp.task('watch', function () {
    gulp.watch('app/**/*.js', ['build']);
});

Upvotes: 22

Related Questions