sjingo/gulpfile.js

## gulpfile.js
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var watch = require('gulp-watch');
var gutil = require('gulp-util');
var browserify = require('browserify');
var babel = require('gulp-babel');
var env = ['development','production'];

gulp.task('set-env', function() {
    return process.env.NODE_ENV = env[1];
});

gulp.task('transform', function() {
    return gulp.src('./app/src/**/*.jsx')
        .pipe(babel({
            presets: ["react", "es2015"]
        }))
        .pipe(gulp.dest('./app/dist'));
})

gulp.task('js', ['transform'], function() {
    // Assumes a file has been transformed from
    // ./app/src/main.jsx to ./app/dist/main.js
    return browserify('./app/dist/main.js')
        .bundle()
        .on('error', gutil.log)
        .pipe(source('main.js'))
        .pipe(buffer())
        .pipe(gulp.dest('./'))
});

gulp.task('default', ['set-env','js'], function() {
    gulp.watch('./app/**/*.jsx', ['js']);
});

## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Hello React!</title>
  </head>
  <body>
    <div id="example"></div>
    <script src="/main.js"></script>
  </body>
</html>

## install
#!/bin/bash
npm install --save-dev babel-preset-es2015 browserify gulp gulp-babel gulp-notify gulp-util gulp-watch react react-dom vinyl-buffer vinyl-source-stream babel-preset-react

## main.jsx
// ./app/src/main.jsx
import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('example')
);
	var gulp = require('gulp');
	var source = require('vinyl-source-stream');
	var buffer = require('vinyl-buffer');
	var watch = require('gulp-watch');
	var gutil = require('gulp-util');
	var browserify = require('browserify');
	var babel = require('gulp-babel');
	var env = ['development','production'];

	gulp.task('set-env', function() {
	return process.env.NODE_ENV = env[1];
	});

	gulp.task('transform', function() {
	return gulp.src('./app/src/*/.jsx')
	.pipe(babel({
	presets: ["react", "es2015"]
	}))
	.pipe(gulp.dest('./app/dist'));
	})

	gulp.task('js', ['transform'], function() {
	// Assumes a file has been transformed from
	// ./app/src/main.jsx to ./app/dist/main.js
	return browserify('./app/dist/main.js')
	.bundle()
	.on('error', gutil.log)
	.pipe(source('main.js'))
	.pipe(buffer())
	.pipe(gulp.dest('./'))
	});

	gulp.task('default', ['set-env','js'], function() {
	gulp.watch('./app/*/.jsx', ['js']);
	});
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8" />
	<title>Hello React!</title>
	</head>
	<body>
	<div id="example"></div>
	<script src="/main.js"></script>
	</body>
	</html>
	#!/bin/bash
	npm install --save-dev babel-preset-es2015 browserify gulp gulp-babel gulp-notify gulp-util gulp-watch react react-dom vinyl-buffer vinyl-source-stream babel-preset-react
	// ./app/src/main.jsx
	import React from 'react';
	import ReactDOM from 'react-dom';

	ReactDOM.render(
	<h1>Hello, world!</h1>,
	document.getElementById('example')
	);