Gulp tasks to build React app via browserify
const gulp = require('gulp');
const sourcemaps = require('gulp-sourcemaps');
const browserify = require('browserify');
const babelify = require('babelify');
const buffer = require('vinyl-buffer');
const uglify = require('gulp-uglify');
const gzip = require('gulp-gzip');
const source = require('vinyl-source-stream2');
const PREAMBLE = `
/* ${packageJSON.name} app v${packageJSON.version}.
* Compiled at $d.
* Made by: ${packageJSON.author}.
* ================================================================== */`;
gulp.task('bundle:dev', () => {
browserify({
entries: 'assets/src/app.js',
debug: true,
extensions: ['.js', '.jsx'],
plugin: null,
})
.transform(babelify)
.bundle()
.pipe(source('app.js'))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('build/app.js'));
});
gulp.task('bundle:prod', () => {
browserify({
entries: 'assets/src/app.js',
debug: false,
extensions: ['.js', '.jsx'],
plugin: null,
})
.transform(babelify)
.bundle()
.pipe(source('app.js'))
.pipe(buffer())
.pipe(uglify({
output: {
preamble: PREAMBLE
}
}))
.pipe(gzip({ gzipOptions: { level: 9 } }))
.pipe(gulp.dest('build/app.js'));
})