Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Gulp + Browserify + Reactify + OS Notification
var source = require('vinyl-source-stream');
var gulp = require('gulp');
var gutil = require('gulp-util');
var browserify = require('browserify');
var reactify = require('reactify');
var watchify = require('watchify');
var notify = require("gulp-notify");
var scriptsDir = './scripts';
var buildDir = './build';
// Based on: http://blog.avisi.nl/2014/04/25/how-to-keep-a-fast-build-with-browserify-and-reactjs/
function buildScript(file, watch) {
var props = watchify.args;
props.entries = [scriptsDir + '/' + file];
props.debug = true;
var bundler = watch ? watchify(browserify(props)) : browserify(props);
bundler.transform(reactify);
function rebundle() {
var stream = bundler.bundle();
return stream.on('error', notify.onError({
title: "Compile Error",
message: "<%= error.message %>"
}))
.pipe(source(file))
.pipe(gulp.dest(buildDir + '/'));
}
bundler.on('update', function() {
rebundle();
gutil.log('Rebundle...');
});
return rebundle();
}
gulp.task('build', function() {
return buildScript('main.js', false);
});
gulp.task('default', ['build'], function() {
return buildScript('main.js', true);
});
{
"name": "scripts",
"version": "0.0.0",
"description": "",
"main": "gulpfile.js",
"devDependencies": {
"browserify": "^6.0.0",
"gulp": "^3.8.7",
"gulp-notify": "^2.0.1",
"gulp-util": "^3.0.1",
"reactify": "^0.14.0",
"uglify-js": "^2.4.13",
"vinyl-source-stream": "^1.0.0",
"watchify": "^2.0.0"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "BSD-2-Clause"
}
@cloud-walker

This comment has been minimized.

Copy link

@cloud-walker cloud-walker commented Nov 5, 2015

What about error line and column?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment