sick-sad-world
3/6/2017 - 8:14 PM

Gulp tasks to build React app via browserify

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