react/babel-setup

.babelrc

{
  "presets" : ["es2015", "react"] 
}

gulpfile.js

'use strict';

const gulp = require('gulp');

const browserify = require('browserify');
const watchify = require('watchify');
const babelify = require('babelify');
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');
const uglify = require('gulp-uglify');
const sourcemaps = require('gulp-sourcemaps');
const util = require('gulp-util');
const { red, yellow, magenta, blue } = require('chalk');
const notify = require('gulp-notify');
const through = require('through2');

function error (err) {
  const { name, fileName, lineNumber, description, 
          column, columnNumber, message } = err;
  let msg = '';

  // regular error
  if (fileName) {
    msg = `
      ${red(name)}: yellow(fileName)
      Line: ${magenta(lineNumber)}, Column: ${magenta(columnNumber || column)}
      ${blue(description)}
    `;
  } // browserify error
  else {
    msg = `${red(name)}: ${yellow(message)}`;
  }

  util.log(msg);
  this.pipe(notify('error'))
  this.emit('end');
}

function noop () {
  return through.obj();
}

function done (type, start) {
  return notify(`${type} done, time spent: ${Date.now() - start}ms`);
}

function javascript (watch, prod) {
  const opts = {
    entries: ['assets/js/main.js'],
    debug: !prod,
    extensions: ['.jsx']
  }

  const bundler = watch ? watchify(browserify(opts)) : browserify(opts);
  bundler.transform(babelify)

  function build () {
    const start = Date.now();
    bundler
    .bundle()
    .on('error', error)
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(sourcemaps.init({ loadMaps: true }))
    .pipe(sourcemaps.write('public/map')) 
    .pipe(uglify({ mangle: false }))
    .pipe(gulp.dest('public/js'))
    .pipe(prod ? noop() : done('Javascript', start))
  } 
  bundler.on('update', build);
  build();
}

gulp.task('watch', () => {
  javascript(true);
});

gulp.task('build', () => {
  javascript(false, true);
});

gulp.task('default', ['watch'])

package.json

{
  "name": "<name>",
  "version": "1.0.0",
  "engines": {
    "node": "7.4.x"
  },
  "license": "MIT",
  "dependencies": {
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.23.0",
    "babelify": "^7.3.0",
    "browserify": "^13.3.0",
    "chalk": "^1.1.3",
    "gulp": "^3.9.1",
    "gulp-notify": "^3.0.0",
    "gulp-sourcemaps": "^2.3.1",
    "gulp-uglify": "^2.0.0",
    "gulp-util": "^3.0.8",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "through2": "^2.0.3",
    "uglify-js": "^2.7.5",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "watchify": "^3.8.0"
  }
}