var gulp = require('gulp'), | |
sass = require('gulp-sass'), | |
browserify = require('gulp-browserify'), | |
concat = require('gulp-concat'), | |
embedlr = require('gulp-embedlr'), | |
refresh = require('gulp-livereload'), | |
lrserver = require('tiny-lr')(), | |
express = require('express'), | |
livereload = require('connect-livereload') | |
livereloadport = 35729, | |
serverport = 5000; | |
//We only configure the server here and start it only when running the watch task | |
var server = express(); | |
//Add livereload middleware before static-middleware | |
server.use(livereload({ | |
port: livereloadport | |
})); | |
server.use(express.static('./build')); | |
//Task for sass using libsass through gulp-sass | |
gulp.task('sass', function(){ | |
gulp.src('sass/*.scss') | |
.pipe(sass()) | |
.pipe(gulp.dest('build')) | |
.pipe(refresh(lrserver)); | |
}); | |
//Task for processing js with browserify | |
gulp.task('browserify', function(){ | |
gulp.src('js/*.js') | |
.pipe(browserify()) | |
.pipe(concat('bundle.js')) | |
.pipe(gulp.dest('build')) | |
.pipe(refresh(lrserver)); | |
}); | |
//Task for moving html-files to the build-dir | |
//added as a convenience to make sure this gulpfile works without much modification | |
gulp.task('html', function(){ | |
gulp.src('views/*.html') | |
.pipe(gulp.dest('build')) | |
.pipe(refresh(lrserver)); | |
}); | |
//Convenience task for running a one-off build | |
gulp.task('build', function() { | |
gulp.run('html', 'browserify', 'sass'); | |
}); | |
gulp.task('serve', function() { | |
//Set up your static fileserver, which serves files in the build dir | |
server.listen(serverport); | |
//Set up your livereload server | |
lrserver.listen(lrport); | |
}); | |
gulp.task('watch', function() { | |
//Add watching on sass-files | |
gulp.watch('sass/*.scss', function() { | |
gulp.run('sass'); | |
}); | |
//Add watching on js-files | |
gulp.watch('js/*.js', function() { | |
gulp.run('browserify'); | |
}); | |
//Add watching on html-files | |
gulp.watch('views/*.html', function () { | |
gulp.run('html'); | |
}); | |
}); | |
gulp.task('default', function () { | |
gulp.run('build', 'serve', 'watch'); | |
}); |
var gulp = require('gulp'), | |
sass = require('gulp-sass'), | |
browserify = require('gulp-browserify'), | |
concat = require('gulp-concat'), | |
embedlr = require('gulp-embedlr'), | |
refresh = require('gulp-livereload'), | |
lrserver = require('tiny-lr')(), | |
http = require('http'), | |
ecstatic = require('ecstatic'), | |
livereloadport = 35729, | |
serverport = 5000; | |
//Task for sass using libsass through gulp-sass | |
gulp.task('sass', function(){ | |
gulp.src('sass/*.scss') | |
.pipe(sass()) | |
.pipe(gulp.dest('build')) | |
.pipe(refresh(lrserver)); | |
}); | |
//Task for processing js with browserify | |
gulp.task('browserify', function(){ | |
gulp.src('js/*.js') | |
.pipe(browserify()) | |
.pipe(concat('bundle.js')) | |
.pipe(gulp.dest('build')) | |
.pipe(refresh(lrserver)); | |
}); | |
//Task for embedding the livereload snippet into html-files | |
//This could be replaced with connect-livereload if using a connect-static-server | |
//Ecstatic(the static server in use) does not have livereload-middleware | |
gulp.task('html', function(){ | |
gulp.src('views/*.html') | |
.pipe(embedlr()) | |
.pipe(gulp.dest('build')) | |
.pipe(refresh(lrserver)); | |
}); | |
//Convenience task for running a one-off build | |
gulp.task('build', function() { | |
gulp.run('html', 'browserify', 'sass'); | |
}); | |
gulp.task('serve', function() { | |
//Set up your static fileserver, which serves files in the build dir | |
http.createServer(ecstatic({ root: __dirname + '/build' })).listen(serverport); | |
//Set up your livereload server | |
lrserver.listen(livereloadport); | |
}); | |
gulp.task('watch', function() { | |
//Add watching on sass-files | |
gulp.watch('sass/*.scss', function() { | |
gulp.run('sass'); | |
}); | |
//Add watching on js-files | |
gulp.watch('js/*.js', function() { | |
gulp.run('browserify'); | |
}); | |
//Add watching on html-files | |
gulp.watch('views/*.html', function () { | |
gulp.run('html'); | |
}); | |
}); | |
gulp.task('default', function () { | |
gulp.run('build', 'serve', 'watch'); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment