Skip to content

Instantly share code, notes, and snippets.

@Leechael
Created July 14, 2014 09:31
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save Leechael/a3fa50297b0456c64bbb to your computer and use it in GitHub Desktop.
Save Leechael/a3fa50297b0456c64bbb to your computer and use it in GitHub Desktop.
gulpfile.js for browserify + backbone.js + ractive.js, with watchify
var path = require("path");
var gulp = require("gulp");
var less = require("gulp-less");
var notify = require("gulp-notify");
var rename = require("gulp-rename");
var minifyCSS = require("gulp-minify-css");
var uglify = require("gulp-uglifyjs");
var livereload = require("gulp-livereload");
var source = require("vinyl-source-stream");
var browserify = require("browserify");
var watchify = require("watchify");
var ractivate = require("ractivate");
function ErrorHandler(err) {
var args = Array.prototype.slice.call(arguments);
// Send error to notification center with gulp-notify
notify.onError({
title: "Compile Error",
message: "<%= error.message %>"
}).apply(this, args);
// Print stacktrace for Error
console.log(err.stack)
// Keep gulp from hanging on this task
this.emit("end");
}
function Bundler (factory) {
this.bundle = factory("./app/assets/js/app.js")
.transform({extensions: [".mustache"]}, ractivate)
}
Bundler.prototype.run = function () {
return this.bundle
.bundle({debug: true})
.on("error", ErrorHandler)
.pipe(source("app.js"))
.pipe(gulp.dest("./public/assets/js"))
}
Bundler.prototype.on = function () {
return this.bundle.on.apply(this.bundle, arguments)
}
/********************************************************************
*
* Tasks
*
********************************************************************/
gulp.task("browserify", function(){
var bundler = new Bundler(browserify)
bundler.run()
});
gulp.task("watchify", function(){
var bundler = new Bundler(watchify)
bundler.on("update", function(){
return bundler.run()
})
return bundler.run()
});
gulp.task("uglify", function(){
gulp.src("./public/assets/js/app.js")
.pipe(uglify("app.min.js", {
outSourceMap: true
}))
.pipe(gulp.dest("./public/assets/js"))
});
gulp.task("less", function(){
gulp.src("./app/assets/less/app.less")
.on("error", ErrorHandler)
.pipe(less({
paths: [ path.join(__dirname, "app", "assets", "less", "includes") ]
}))
.pipe(gulp.dest("./public/assets/css"))
.pipe(minifyCSS())
.pipe(rename({suffix: ".min"}))
.pipe(gulp.dest("./public/assets/css"))
});
gulp.task("watch", ["watchify"], function(){
gulp.watch("./public/assets/js/app.js", ["uglify"]);
gulp.watch("./app/assets/less/**", ["less"]);
});
gulp.task("build", ["browserify", "uglify", "less"]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment