watchify-gulpify

build.js

var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
var config = require('../config.json');
var bundler = require('./bundler');

process.env.APP_ID = config.Client.AppId;
process.env.JS_KEY = config.Client.jsKey;

gulp.task('scripts', function() {
   gulp.src('./src/js/init.js', {read: false})
       .pipe($.plumber($.util.log)
       .pipe($.tap(bundler))
       .pipe(gulp.dest('./build'));
});

gulp.task('watch', function() {
    var server = $.livereload();
    gulp.watch('./build/**').on('change', function(file) {
        server.changed(file.path);
    });
});

gulp.task('build', ['scripts', 'watch']);

bundler.js

var gulp = require('gulp');
var watchify = require('watchify');
var $ = require('gulp-load-plugins')();
var w;

function bundler(file) {
  if (!w) {
      w = watchify({
        entries: [file.path], //file.contents may be used if {buffer: false} is set
        extensions:['.jsx']
      });
      w.on('log', $.util.log)
       .on('update', function() {
          gulp.start('scripts');
      });
    }

    var stream = w.bundle();
    file.contents = stream;
  
}

module.exports = bundler;

package.json

"browserify": {
    "transform": [
      "envify",
      "reactify",
      "browserify-shim"
    ]
  },
"devDependencies": {
    "bowserify": "^4.1.3",
    "envify": "^1.2.1",
    "gulp": "^3.6.2",
    "gulp-livereload": "^1.5.0",
    "gulp-load-plugins": "^0.5.1",
    "gulp-plumber": "^0.6.1",
    "gulp-tap": "^0.1.1",
    "gulp-util": "^2.2.14",
    "react": "^0.10.0",
    "react-tools": "^0.10.0",
    "reactify": "^0.13.1",
    "vinyl-buffer": "0.0.0",
    "vinyl-source-stream": "^0.1.1",
    "watchify": "^0.10.1"
}