Skip to content

Instantly share code, notes, and snippets.

@cblunt
Created May 11, 2017 21:37
Show Gist options
  • Save cblunt/cf852928d9e1a7049ee48e20637b8133 to your computer and use it in GitHub Desktop.
Save cblunt/cf852928d9e1a7049ee48e20637b8133 to your computer and use it in GitHub Desktop.
Gulpfile for simple static website prototyping
// $ npm install
// $ gulp serve
// $ open http://localhost:8080
var gulp = require('gulp'),
del = require('del'),
scss = require('gulp-sass'),
htmlmin = require('gulp-htmlmin'),
cleancss = require('gulp-clean-css'),
connect = require('gulp-connect'),
uglify = require('gulp-uglify'),
imagemin = require('gulp-imagemin'),
fileinclude = require('gulp-file-include');
gulp.task('clean', function() {
return del.sync('_site/**/*', '!/_site');
});
gulp.task('scss', function() {
return gulp.src('./src/scss/**/application.scss')
.pipe(scss().on('error', scss.logError))
.pipe(cleancss({compatibility: 'ie9'}))
.pipe(gulp.dest('./_site/css'))
.pipe(connect.reload());
});
gulp.task('html', function() {
return gulp.src(['./src/**/*.html', '!./src/**/_*/*.html'])
.pipe(fileinclude({
prefix: '@@',
basepath: './src/_includes/'
}))
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest('./_site/'))
.pipe(connect.reload());
});
gulp.task('js', function() {
return gulp.src('./src/js/**/*.js')
.pipe(uglify())
.pipe(gulp.dest('./_site/js'))
.pipe(connect.reload());
});
gulp.task('images', function() {
return gulp.src('./src/images/**/*.{png,gif,jpg,ico}')
.pipe(imagemin())
.pipe(gulp.dest('_site/images'))
.pipe(connect.reload());
});
gulp.task('misc', function() {
gulp.src([
'./src/favicon.ico',
'./src/robots.txt',
'./src/sitemap.xml'
])
.pipe(gulp.dest('_site/'));
});
gulp.task('build', ['scss', 'js', 'images', 'misc', 'html'], function() {
connect.reload();
});
gulp.task('watch', function() {
gulp.watch(['./src/**/*.html'], ['html']);
gulp.watch(['./src/js/**/*.js'], ['js']);
gulp.watch(['./src/scss/**/*.scss'], ['scss']);
gulp.watch(['./src/images/**/*.{png,gif,jpg}'], ['images']);
});
gulp.task('connect', function() {
connect.server({
root: '_site/',
livereload: true
});
});
gulp.task('serve', ['build', 'connect', 'watch']);
gulp.task('default', ['build']);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment