CODEWITHSUNDEEP
javascriptgulpbrowserify
Jurie Horneman
Jurie Horneman

Reputation: 116

Gulp with browserify: Cannot find start module

I have pretty much the exact same problem as described in Gulp with browserify: Cannot find module src/js/main.js: I have a JavaScript project that I can build using browserify from the command line, but not in gulp. But the solution for that question does not work for me.

From the command line:

browserify -t reactify ./js/inspector > static/js/inspector.js

works perfectly. When I run the following gulp task:

gulp.task('browserify', function() {
  return browserify({
        transform: ['reactify'],
        entries: ['./js/inspector.js']
    })
    .bundle()
    .pipe(source('inspector.js'))
    .pipe(gulp.dest('./static/js/'));
});

and run it, I get the following error in the console:

Error: Cannot find module '../../inspector'

and also the generated file has the same length as the CLI file but not the same order of modules. Which puzzles me.

I have the same version of browserify in my global and local modules, and I've not knowingly configured it, anywhere.

Unlike Ben Davis, who asked the other question, adding a ./ to the start of my path changes nothing.

I don't understand why browserify gives a different, and broken, output, when run through gulp.

Update: The directory structure of the project:

gulpfile.js
node_modules/
js/                  (also contains subdirectories with JS code)
    inspector.js
static/
    js/
        inspector.js (built)

Update: When I run Browserify through Grunt, I also get a different file, but it works.

Upvotes: 2

Views: 678

Answers (2)

Jurie Horneman
Jurie Horneman

Reputation: 116

I had other modules that required the root module, à la:

var inspector = require('../../inspector');

This is what caused the problem (somehow). Putting in a root module that was never required by anything else made gulp + browserify work without any problems.

I'll see if I can create a minimal reproduction project for the gulp / browserify maintainers.

Upvotes: 0

joshvito
joshvito

Reputation: 1563

You can try wrapping your return function in an IIFC.

//======================================
// Task: browserify
//======================================
gulp.task('browserify', function() {
  return (function() {
    browserify(config.src)
      .bundle()
      .pipe(source(config.name))
      .pipe(gulp.dest(config.dest));
  })();
});

I am using the above successfully in a current proj.

Upvotes: 0

Related Questions