Augment browserify
with the following features:
- Accept patterns to add entries.
- Use
watchify2
to watch files, which is able to detect new entries. - Use
common-bundle
to pack modules by default, which makeb.bundle()
output a stream manipulatable bygulp
plugins.
Suppose we want to create one bundle for each js file in /path/to/src
,
and an additional common bundle to hold modules shared among them.
const reduce = require('reduce-js')
const path = require('path')
const del = require('del')
const uglify = require('gulp-uglify')
bundle(createBundler())
function createBundler(watch) {
var b = reduce.create(
/* glob for entries */
'*.js',
/* options for browserify */
{
basedir: path.join(__dirname, 'src'),
cache: {},
packageCache: {},
},
/* options for common-bundle */
// single bundle
// 'bundle.js',
// multiple bundles
{
groups: '*.js',
common: 'common.js',
},
/* options for watchify2 */
watch && { entryGlob: '*.js' }
)
return b
}
function bundle(b) {
var build = path.join(__dirname, 'build')
del.sync(build)
return b.bundle().pipe(uglify()).pipe(b.dest(build))
}
To watch file changes:
var b = createBundler(true)
b.on('update', function update() {
bundle(b)
return update
}())
To work with gulp:
var gulp = require('gulp')
gulp.task('build', function () {
return bundle(createBundler())
})
gulp.task('watch', function (cb) {
var b = createBundler(true)
b.on('update', function update() {
bundle(b)
return update
}())
b.on('close', cb)
})
var reduce = require('reduce-js')
var b = reduce.create(entries, browserifyOptions, bundleOptions, watchifyOptions)
Return a browserify
instance.
entries
: patterns to locate input files. Check [globby
] for more details.browserifyOptions
: options forbrowserify
.bundleOptions
: options forcommon-bundle
.watchifyOptions
: options forwatchify2
. If truthy, file changes are watched.
Return a [vinyl
] stream,
which can be processed by gulp plugins.
b.bundle().pipe(require('gulp-uglify')()).pipe(b.dest('build'))
The same with gulp.dest
.