Home Original page

GitHub - reducejs/reduce-js: A sugar wrapper for browserify.

version status coverage dependencies devDependencies node

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 make b.bundle() output a stream manipulatable by gulp plugins.

Example

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)
})

API

var reduce = require('reduce-js')
var b = reduce.create(entries, browserifyOptions, bundleOptions, watchifyOptions)

reduce.create(entries, browserifyOptions, bundleOptions, watchifyOptions)

Return a browserify instance.

  • entries: patterns to locate input files. Check [globby] for more details.
  • browserifyOptions: options for browserify.
  • bundleOptions: options for common-bundle.
  • watchifyOptions: options for watchify2. If truthy, file changes are watched.

b.bundle()

Return a [vinyl] stream, which can be processed by gulp plugins.

b.bundle().pipe(require('gulp-uglify')()).pipe(b.dest('build'))

b.dest(outFolder, options)

The same with gulp.dest.

Related