Watchify events are not firing

[bokzor]

Hi,

For severals files in my project, watchify is not working...

I tried and searched a lot but I didn't find a clue how to resolve this.

Everything is up to date. I'm using OSx with no virtual machine

Here is my gulp task :

gulp.task('browserify-watch', function () {
  var bundler = watchify(browserify({ entries: 'app/main.js', debug: true }, watchify.args));
  bundler.external(dependencies);
  bundler.transform(babelify, { presets: ['es2015', 'react', 'stage-0'] });
  bundler.on('update', rebundle);
  return rebundle();

  function rebundle() {
    var start = Date.now();
    return bundler.bundle()
      .on('error', function(err) {
        gutil.log(gutil.colors.red(err.toString()));
      })
      .on('end', function() {
        gutil.log(gutil.colors.green('Finished rebundling in', (Date.now() - start) + 'ms.'));
      })
      .pipe(source('bundle.js'))
      .pipe(buffer())
      .pipe(sourcemaps.init({ loadMaps: true }))
      .pipe(sourcemaps.write('.'))
      .pipe(gulp.dest('public/js/'));
  }
});

[mattdesl]

Yup getting something similar. Seems to be a chokidar issue in my case – files are being watched but chokidar change events are not triggering.

[mattdesl]

Strange – in my case I renamed the folder to something else, tested, then renamed it back to its original name, and now everything is working again.

[bcherny]

Same here, on OSX. The issue seems to be with Chokidar.

Watching ~100 files, if i leave the watcher open for a day the issue tends to happen.

Restarting my machine consistently fixes it.

I already tried increasing the watch limit (ulimit).

Other, non-chokidar watcher don't have this issue.

[rasmusvhansen]

Same here on Windows using CLI. About one in three times, the change is not caught. Polling seems to fix it, but that uses more resources.

[TexRx]

Polling does not fix it for me. Nothing is triggering the rebundle. I'm running on Windows 10, using the latest versions of browserify, watchify, gulp, etc -- all npm modules are up-to-date.

[dahei]

Same here on Windows 10 Home Premium 64 Bit. I am using polling by default but sometimes no changes where detected.

Edit: A full Windows restart fixed it for me. But it wasn't the first time, the changes weren't detected.

[bokzor]

I was using Webstorm. I desactivate the safe save option. And now It works correctly.

[lorenzos]

Same for me, the update is never triggered. I'm on Ubuntu, using Atom. I also tried with "poll": true Here's my code:

var b = watchify(browserify({
    entries: './main.jsx',
    debug: true, // Adds a source map inline to the end of the bundle
    cache: { }, // Required by watchify plugin
    packageCache: { } // Required by watchify plugin
}), {
    poll: true
});
b.on('log', function(data) {
    console.log(data);
});
b.on('update', function() {
    console.log("UPDATE!");
    return b.bundle()
        .on('error', plugins.util.log.bind(plugins.util, 'Browserify Error'))
        .pipe(source('build.js'))
        .pipe(gulp.dest('./'))
        .pipe(plugins.livereload());
});

Also log event is never triggered, and in the console I never see UPDATE!.

[lorenzos]

I solved, I think it was my fault. I'm not sure why, but it looks like it's required to run the bundle function when the task executes the first time.

So, to fix the code in my example, I had to move the code inside the update event in a function, so I can run it manually when the task executes. This is the code in the task now:

var b = watchify(browserify({
    entries: './main.jsx',
    debug: true, // Adds a source map inline to the end of the bundle
    cache: { }, // Required by watchify plugin
    packageCache: { } // Required by watchify plugin
}));

var bundle = function() {
    return b.bundle()
        .on('error', plugins.util.log.bind(plugins.util, 'Browserify Error'))
        .pipe(source('build.js'))
        .pipe(gulp.dest('./'))
        .pipe(plugins.livereload());
};

b.on('update', function() {
    console.log("UPDATE!");
    return bundle();
});

return bundle(); // <-- REQUIRED!

Please note that both the official example and the code posted by @bokzor do not show my mistake, so, sorry for bothering with my case, but that issue is not solved for the other people I guess. Just do not consider my messages :smile:

[patricknelson]

For folks who are using watchify in conjunction with gulp, you might also consider trying gulp-bro. I had a similar issue here where update events weren't firing predictably when using watchify.

The nice thing about gulp-bro is that you can instead utilize the native gulp.watch(...) API, since it works like a regular plugin. This may not work for everybody, but it sure worked for me! 🎉