Skip to content

Instantly share code, notes, and snippets.

@piscis
Created July 14, 2015 09:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save piscis/9e367c2de94200184bca to your computer and use it in GitHub Desktop.
Save piscis/9e367c2de94200184bca to your computer and use it in GitHub Desktop.
Bable gulp file used to build and deploy a ReactJS app
import path from 'path';
import cp from 'child_process';
import gulp from 'gulp';
import gulpLoadPlugins from 'gulp-load-plugins';
import del from 'del';
import mkdirp from 'mkdirp';
import runSequence from 'run-sequence';
import webpack from 'webpack';
import minimist from 'minimist';
import {exec} from 'child_process';
import ghPages from 'gh-pages';
const argv = minimist(process.argv.slice(2));
const $ = gulpLoadPlugins();
const src = Object.create(null);
let watch = false;
let browserSync;
// The default task
gulp.task('default', ['sync']);
// Clean output directory
gulp.task('clean', cb => {
del(['.tmp', 'build/*', '!build/.git'], {dot: true}, () => {
mkdirp('build/public', cb);
});
});
// Static files
gulp.task('assets', () => {
src.assets = 'src/public/**';
return gulp.src(src.assets)
.pipe($.changed('build/public'))
.pipe(gulp.dest('build/public'))
.pipe($.size({title: 'assets'}));
});
// Resource files
gulp.task('resources', () => {
src.resources = [
'package.json',
'src/content*/**',
'src/templates*/**'
];
return gulp.src(src.resources)
.pipe($.changed('build'))
.pipe(gulp.dest('build'))
.pipe($.size({title: 'resources'}));
});
// Bundle
gulp.task('bundle', cb => {
const config = require('./webpack.config.js');
const bundler = webpack(config);
const verbose = !!argv.verbose;
let bundlerRunCount = 0;
function bundle(err, stats) {
if (err) {
throw new $.util.PluginError('webpack', err);
}
console.log(stats.toString({
colors: $.util.colors.supportsColor,
hash: verbose,
version: verbose,
timings: verbose,
chunks: verbose,
chunkModules: verbose,
cached: verbose,
cachedAssets: verbose
}));
if (++bundlerRunCount === (watch ? config.length : 1)) {
return cb();
}
}
if (watch) {
bundler.watch(200, bundle);
} else {
bundler.run(bundle);
}
});
// Build the app from source code
gulp.task('build', ['clean'], cb => {
runSequence(['assets', 'resources'], ['bundle'], cb);
});
// Build and start watching for modifications
gulp.task('build:watch', cb => {
watch = true;
runSequence('build', () => {
gulp.watch(src.assets, ['assets']);
gulp.watch(src.resources, ['resources']);
cb();
});
});
// Launch a Node.js/Express server
gulp.task('serve', ['build:watch'], cb => {
src.server = [
'build/server.js',
'build/content/**/*',
'build/templates/**/*'
];
let started = false;
let server = (function startup() {
const child = cp.fork('build/server.js', {
env: Object.assign({NODE_ENV: 'development'}, process.env)
});
child.once('message', message => {
if (message.match(/^online$/)) {
if (browserSync) {
browserSync.reload();
}
if (!started) {
started = true;
gulp.watch(src.server, function() {
$.util.log('Restarting development server.');
server.kill('SIGTERM');
server = startup();
});
cb();
}
}
});
return child;
})();
process.on('exit', () => server.kill('SIGTERM'));
});
// Launch BrowserSync development server
gulp.task('sync', ['serve'], cb => {
browserSync = require('browser-sync');
browserSync({
logPrefix: 'RSK',
notify: false,
// Run as an https by setting 'https: true'
// Note: this uses an unsigned certificate which on first access
// will present a certificate warning in the browser.
https: false,
// Informs browser-sync to proxy our Express app which would run
// at the following location
proxy: 'localhost:5000'
}, cb);
process.on('exit', () => browserSync.exit());
gulp.watch(['build/**/*.*'].concat(
src.server.map(file => '!' + file)
), file => {
browserSync.reload(path.relative(__dirname, file.path));
});
});
// Build the app from source code
gulp.task('static', ['build'], cb => {
let cmd = `node build/static.js > build/public/index.html`;
exec(cmd, function (err, stdout, stderr) {
console.log(stdout);
console.log(stderr);
cb(err);
});
});
gulp.task('deploy', function(cb) {
const opts = {
repo: 'https://github.com/[YOUR_REPO_HERE].git',
branch: 'gh-pages'
};
const src = path.join(__dirname,'build','public');
ghPages.publish(src, opts, cb);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment