I'm trying to use blanket.js to measure test coverage of my browserified library, and the coverage numbers aren't making much sense since I'm including jQuery, lodash, es5-shim, and x-tag-core.js in the bundle.
I would like to create multiple bundles, as described in the browserify documentation, but from gulp instead of the command line. Essentially I would like to do something like Sebastian Deutch describes, except without the the concatenation step at the end (he's doing separate bundles to shorten compile times).
Can anyone point me to an example of how to do this? (or a better way of doing code coverage..?)
After a lot of trial-and-error, and after abandoning the gulp-browserify plugin (it's black-listed, but examples of using browserify directly in gulp are hard to come by), I managed to get this working. The salient parts of my gulpfile.js are (I'm not sure at all what the source calls do):
var gulp = require('gulp'),
gutil = require('gulp-util'),
clean = require('gulp-rimraf'),
rename = require('gulp-rename'),
source = require('vinyl-source-stream'),
browserify = require('browserify');
gulp.task('browserify:externals', function () {
var vendor = browserify(['jquery', 'es5-shim', 'lodash']);
vendor.require('jquery');
vendor.require('lodash', {expose: '_'});
vendor.require('es5-shim');
return vendor.bundle()
.pipe(source("not-used-but-needed-string.js"))
.pipe(rename('external.js'))
.pipe(gulp.dest('./dist'))
.on('error', gutil.log);
});
gulp.task('browserify', ['browserify:externals'], function () {
var app = browserify('./index.js');
app.external('jquery');
app.external('es5-shim');
app.require('./index.js', {expose: 'maxby'});
return app.bundle()
.pipe(source("not-used-but-needed-string.js"))
.pipe(rename('maxby.js'))
.pipe(gulp.dest('./dist'))
.on('error', gutil.log);
});
I've also created a repository with a complete, but minimal example (I'm quite new at this so any corrections are much appreciated).