Skip to content

Instantly share code, notes, and snippets.

@igmoweb
Last active November 3, 2016 16:59
Show Gist options
  • Save igmoweb/8badae08f97bc2cecde671949ab8ca8c to your computer and use it in GitHub Desktop.
Save igmoweb/8badae08f97bc2cecde671949ab8ca8c to your computer and use it in GitHub Desktop.
Gulp task to watch changes in React App
var gulp = require('gulp'),
browserify = require('browserify'),
babel = require('babelify'),
source = require('vinyl-source-stream'),
buffer = require('vinyl-buffer'),
rename = require('gulp-rename'),
watchify = require('watchify');
function executeBundle(bundle) {
return bundle
.bundle()
.on("error", function (err) { console.log("Error : " + err.message); })
.pipe(source('index.js'))
.pipe(rename('app.js'))
.pipe(gulp.dest('./build'));
}
gulp.task('default', function () {
var options = {
entries: ['./src/index.js'],
debug: true
};
var bundle = browserify(options);
bundle.transform(babel.configure({presets: ["es2015", "react"]}));
return executeBundle( bundle );
});
gulp.task('watch', function () {
var options = {
entries: ['./src/index.js'],
debug: true
};
var bundle = browserify(options);
bundle = watchify( bundle );
bundle.transform(babel.configure({presets: ["es2015", "react"]}));
bundle
.on('update', function( file ) {
console.log("Updated file. Bundling...");
console.log(file);
executeBundle( bundle );
})
.on('log', function( msg ) {
console.log( msg );
});
return executeBundle( bundle );
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment