Watchify not rebuilding dependencies

[calvinchoy]

I used the watchify recipe from the gulp repro as is. When I run the task, everything works fine, and the bundle.js works as exptected.

However, when I make changes to dependencies (required modules/files in main.js), watchify is not recompiling the changes I made in the dependencies. Changes made in die main.js files however are updated correctly.

So it looks like watchify fires on changes, but only compiles the main.js file with cached dependencies.

EDIT: it seems like watchify is not updating at all, as if the update event is not fired.

I am on macos yosemite

This is the recipe I used:

'use strict';

var watchify = require('watchify');
var browserify = require('browserify');
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var gutil = require('gulp-util');
var sourcemaps = require('gulp-sourcemaps');
var assign = require('lodash.assign');

// add custom browserify options here
var customOpts = {
  entries: ['main.js'],
  debug: true
};
var opts = assign({}, watchify.args, customOpts);
var b = watchify(browserify(opts));

gulp.task('js', bundle); // so you can run `gulp js` to build the file
b.on('update', bundle); // on any dep update, runs the bundler
b.on('log', gutil.log); // output build logs to terminal

function bundle() {
  return b.bundle()
    // log errors if they happen
    .on('error', gutil.log.bind(gutil, 'Browserify Error'))
    .pipe(source('bundle.js'))
    // optional, remove if you don't need to buffer file contents
    .pipe(buffer())
    // optional, remove if you dont want sourcemaps
    .pipe(sourcemaps.init({loadMaps: true})) // loads map from browserify file
       // Add transformation tasks to the pipeline here.
    .pipe(sourcemaps.write('./')) // writes .map file
    .pipe(gulp.dest('./dist'));
}

[zertosh]

Try changing entries: ['main.js'], to entries: ['./main.js'],

[calvinchoy]

I tried using the absolute path

./path/to/main.js

Still the same.  if I wrap the task with gulp watch and run the task on change it runs the bundle task but only recompiling the main.js changes while using old dependencies compiles. 

Without a gulp watch wrap it does not compile anything. As If the update event is not firing. I tried to change the update event callback with console.log but nothing happens. 

It looks like a similar problem people had with NHS but I thought the problem was patched already. Maybe any settings I have to pass to watchify or browserify in gulp? 

Calvin

On Thu, Apr 9, 2015 at 4:32 AM, Andres Suarez notifications@github.com wrote:

Try changing entries: ['main.js'], to entries: ['./main.js'],

Reply to this email directly or view it on GitHub: https://github.com/substack/watchify/issues/194#issuecomment-91098321

[calvinchoy]

I tried using the raw watchify command

watchify resources/assets/js/main.js -o public/js/bundle.js -v

Output:

360990 bytes written to public/js/bundle.js (0.90 seconds)

Now when changes are made in main.js itself or required dependencies, no recompile is initiated anymore.

[zertosh]

Everything looks like it should be working. If you're even having a problem with the CLI, then there is probably something up with your setup. Do you have a repo or something I could check out?

[calvinchoy]

Hey, thanks for helping!

The gulp/watchify tasks are currently implemented in a private project for work. I will try to reproduce the problem in an empty repro tonight and update issue status whether the problem still exist.

[zertosh]

Np, let me know when you're ready

[calvinchoy]

Hey,

I created a repro: https://github.com/calvinchoy/watchify-issue-194

Using the command:

watchify main.js -o dist/bundle.js -v

Watchify bundles main.js into dist/bundle.js, when I edit dependency.js no recompiling is fired.

[zertosh]

@calvinchoy The package.json doesn't specify a watchify version, which leads me to believe that you're running a global version of watchify that might be an outdated version. Can you verify that you're using the latest version?

[calvinchoy]

@zertosh I installed watchify 3.1.0 locally now, it is added to the package.json file. Same result.

I am using osx yosemite if it matters.

Anyway, I expect bundle.js to update if I edit dependency.js. This is the purpose of watchify right? Just to be sure I am not misunderstanding the usage of watchify :)

Thanks

[zertosh]

That's exactly the point of watchify. It also caches files, so only those that changed get rebuilt - this makes for fast rebuilds.

I just tired your repo, using your command, and it works. I edit dependency.js or main.js, and dist/bundle.js gets rebuilt automatically with the changes.

I'm also on yosemite. Maybe ./node_modules/.bin is not in your PATH. Can you try ./node_modules/.bin/watchify main.js -o dist/bundle.js -v?

[calvinchoy]

Well if it works on your system it is probably a setup problem of mine =/

I tried ./node_modules/.bin/watchify main.js -o dist/bundle.js -v. Same result, single built no rebuilds made on edit and save.

Here is a bit more info:

npm root -g is /usr/local/lib/node_modules

node version: 0.10.35

[zertosh]

That's really strange. I've used node 0.10.36-38 and 0.12.1-2. Sorry :(

[calvinchoy]

No problem, thanks for helping anyway!

I will see if I can figure out what the problem is, maybe other people have the same (wrong) setup as mine.

Meanwhile I can live with building separate browserify bundles.

Thanks

[calvinchoy]

I don't know what the problem is but I updated to latest nodejs, it is working as intended now!

[getreup]

Same issue happened to me. Updating nodejs worked! http://davidwalsh.name/upgrade-nodejs

[BalasubramaniM]

In my case, it was working but I couldn't see any commands or acknowledgement in the terminal and I thought it was not working. But after adding an option -v to the script to get more information about this process like below one,

"watch": "watchify dist/app.js -o dist/bundle.js -v"

I could see the acknowledgement which gives information about the process. Thank you.