diff --git a/docs/recipes/fast-browserify-builds-with-watchify.md b/docs/recipes/fast-browserify-builds-with-watchify.md index 0775a530e..a566726d2 100644 --- a/docs/recipes/fast-browserify-builds-with-watchify.md +++ b/docs/recipes/fast-browserify-builds-with-watchify.md @@ -7,34 +7,40 @@ That's why [substack](http://github.com/substack) wrote [watchify](http://github Watchify doesn't have a gulp plugin, but it doesn't need one either: you can use [vinyl-source-stream](http://github.com/hughsk/vinyl-source-stream) to pipe the bundle stream into your gulp pipeline. ``` javascript +'use strict'; + +var watchify = require('watchify'); +var browserify = require('browserify'); var gulp = require('gulp'); -var gutil = require('gulp-util'); -var sourcemaps = require('gulp-sourcemaps'); var source = require('vinyl-source-stream'); var buffer = require('vinyl-buffer'); -var watchify = require('watchify'); -var browserify = require('browserify'); +var gutil = require('gulp-util'); +var sourcemaps = require('gulp-sourcemaps'); +var assign = require('lodash.assign'); -var bundler = watchify(browserify(watchify.args)); -// add the file to bundle -bundler.add('./src/index.js'); -// add any other browserify options or transforms here -bundler.transform('brfs'); +// add custom browserify options here +var customOpts = { + entries: ['./src/index.js'], + debug: true +}; +var opts = assign(customOpts, watchify.args); +var b = watchify(browserify(opts)); gulp.task('js', bundle); // so you can run `gulp js` to build the file -bundler.on('update', bundle); // on any dep update, runs the bundler -bundler.on('log', gutil.log); // output build logs to terminal +b.on('update', bundle); // on any dep update, runs the bundler +b.on('log', gutil.log); // output build logs to terminal function bundle() { - return bundler.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(buffer()) - .pipe(sourcemaps.init({loadMaps: true})) // loads map from browserify file - .pipe(sourcemaps.write('./')) // writes .map file - // + .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')); } ```