Gulp Not Watching

Question

So consider the following gulp file:

var gulp        = require('gulp');
var source      = require('vinyl-source-stream');
var browserify  = require('browserify');
var babelify    = require("babelify");
var watch       = require('gulp-watch');

gulp.task('make:engine', function() {
  return browserify({entries: [
        './src/index.js'
      ]})
      .transform("babelify")
      .bundle()
      .pipe(source('engine.js'))
      .pipe(gulp.dest('dist/'));
});

gulp.task('make:example', function() {
  return browserify({entries: [
        './examples/index.js'
      ]})
      .transform("babelify")
      .bundle()
      .pipe(source('compiled-example.js'))
      .pipe(gulp.dest('dist/example/'));
});

gulp.task('watch', ['make:engine', 'make:example'], function(){
  return watch('*.js', ['make:engine', 'make:example']);
});

gulp watch spits out:

[15:06:01] Using gulpfile ~/Documents/ice-cream-engine/gulpfile.js
[15:06:01] Starting 'make:engine'...
[15:06:01] Starting 'make:example'...
[15:06:03] Finished 'make:example' after 1.57 s
[15:06:03] Finished 'make:engine' after 1.6 s
[15:06:03] Starting 'watch'...

In ANY js file, if I make an edit and save the file, the terminal doesn't update to say that it is making the engine or the examples.

The project directory looks as follows:

What am I doing wrong such that it wont actually re-compile on ANY JS file change?

There's a good chance it (by default) requires NFS (google it) events to watch for changes, instead of scanning all files the regex matches every 0.x seconds (which takes a lot more cpu). If your OS (or VM) does not support this, you'll have to disable that option. — Stephan Bijzitter, Oct 04 '16 at 21:13
@StephanBijzitter This answer doesnt help at all. I am using MAC OSX and your answer doesnt provide anything helpful. — TheWebs, Oct 04 '16 at 21:18
Well that's a tad aggressive. OSX supports NFS events, so you're good there. Note sure how Gulp handles globs, but you can also try to use `**/*.js` or `src/**/*.js`. — Stephan Bijzitter, Oct 04 '16 at 21:39

score 3 · Accepted Answer · answered Oct 04 '16 at 22:04

According to your screenshot, the only .js file that matches the glob you have passed to watch is gulpfile.js.

If you want to watch all .js files under the src and example directories, you could use the following:

gulp.task('watch', ['make:engine', 'make:example'], function(){
  return watch(['src/**/*.js', 'examples/**/*.js'], ['make:engine', 'make:example']);
});

Gulp Not Watching

1 Answers1