Gulp task to make browserify build with HMR included
const gulp = require('gulp');
const browserify = require('browserify');
const sourcemaps = require('gulp-sourcemaps');
const babelify = require('babelify');
const buffer = require('vinyl-buffer');
const source = require('vinyl-source-stream2');
const watchify = require('watchify');
const livereactload = require('livereactload');
const gutil = require('gulp-util');
gulp.task('react-hmr', () => {
let b = browserify({
entries: 'assets/src/app.js',
cache: {},
packageCache: {},
debug: true,
extensions: ['.js', '.jsx'],
plugin: [watchify, livereactload],
}).bundle();
b.on('update', () => {
gutil.log('Rerunning browserify...');
const updateStart = Date.now();
_build().on('end', () => gutil.log(`...Done ${Date.now() - updateStart} ms`));
});
let _build = () => {
b.bundle()
.on('error', (err) => gutil.log(err.stack))
.pipe(source('app.js'))
.pipe(buffer())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('assets/js/app.js'))
};
return _build();
})