Created
October 19, 2015 09:20
-
-
Save CNSam/e6873252023e03d23ef3 to your computer and use it in GitHub Desktop.
gulpfile.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Gulp Packages | |
*/ | |
// General | |
var gulp = require('gulp'); | |
var fs = require('fs'); | |
var del = require('del'); | |
var lazypipe = require('lazypipe'); | |
var plumber = require('gulp-plumber'); | |
var flatten = require('gulp-flatten'); | |
var tap = require('gulp-tap'); | |
var rename = require('gulp-rename'); | |
var header = require('gulp-header'); | |
var footer = require('gulp-footer'); | |
var watch = require('gulp-watch'); | |
var livereload = require('gulp-livereload'); | |
var package = require('./package.json'); | |
// Scripts and tests | |
var jshint = require('gulp-jshint'); | |
var stylish = require('jshint-stylish'); | |
var concat = require('gulp-concat'); | |
var uglify = require('gulp-uglify'); | |
var karma = require('gulp-karma'); | |
// Styles | |
var sass = require('gulp-sass'); | |
var prefix = require('gulp-autoprefixer'); | |
var minify = require('gulp-minify-css'); | |
// SVGs | |
var svgmin = require('gulp-svgmin'); | |
var svgstore = require('gulp-svgstore'); | |
// Docs | |
var markdown = require('gulp-markdown'); | |
var fileinclude = require('gulp-file-include'); | |
/** | |
* Paths to project folders | |
*/ | |
var paths = { | |
input: 'src/**/*', | |
output: '', | |
scripts: { | |
input: 'src/js/*', | |
output: 'js/' | |
}, | |
styles: { | |
input: 'src/sass/**/*.{scss,sass}', | |
output: 'css/' | |
}, | |
svgs: { | |
input: 'src/svg/*', | |
output: 'svg/' | |
}, | |
static: 'src/static/**', | |
test: { | |
input: 'src/js/**/*.js', | |
karma: 'test/karma.conf.js', | |
spec: 'test/spec/**/*.js', | |
coverage: 'test/coverage/', | |
results: 'test/results/' | |
}, | |
docs: { | |
input: 'src/docs/*.{html,md,markdown}', | |
output: 'docs/', | |
templates: 'src/docs/_templates/', | |
assets: 'src/docs/assets/**' | |
} | |
}; | |
/** | |
* Template for banner to add to file headers | |
*/ | |
var banner = { | |
full : | |
'/**\n' + | |
' * <%= package.name %> v<%= package.version %>\n' + | |
' * <%= package.description %>, by <%= package.author.name %>.\n' + | |
' * <%= package.repository.url %>\n' + | |
' * \n' + | |
' * Free to use under the MIT License.\n' + | |
' * http://gomakethings.com/mit/\n' + | |
' */\n\n', | |
min : | |
'/**' + | |
' <%= package.name %> v<%= package.version %>, by Chris Ferdinandi' + | |
' | <%= package.repository.url %>' + | |
' | Licensed under MIT: http://gomakethings.com/mit/' + | |
' */\n' | |
}; | |
/** | |
* Gulp Taks | |
*/ | |
// Lint, minify, and concatenate scripts | |
gulp.task('build:scripts', function() { | |
var jsTasks = lazypipe() | |
.pipe(header, banner.full, { package : package }) | |
.pipe(gulp.dest, paths.scripts.output) | |
.pipe(rename, { suffix: '.min' }) | |
.pipe(uglify) | |
.pipe(header, banner.min, { package : package }) | |
.pipe(gulp.dest, paths.scripts.output); | |
return gulp.src(paths.scripts.input) | |
.pipe(plumber()) | |
.pipe(tap(function (file, t) { | |
if ( file.isDirectory() ) { | |
var name = file.relative + '.js'; | |
return gulp.src(file.path + '/*.js') | |
.pipe(concat(name)) | |
.pipe(jsTasks()); | |
} | |
})) | |
.pipe(jsTasks()); | |
}); | |
// Process, lint, and minify Sass files | |
gulp.task('build:styles', function() { | |
return gulp.src(paths.styles.input) | |
.pipe(plumber()) | |
.pipe(sass({ | |
style: 'expanded', | |
lineNumbers: true, | |
noCache: true | |
})) | |
.pipe(flatten()) | |
.pipe(prefix({ | |
browsers: ['last 2 version', '> 1%'], | |
cascade: true, | |
remove: true | |
})) | |
.pipe(gulp.dest(paths.styles.output)) | |
.pipe(rename({ suffix: '.min' })) | |
.pipe(minify()) | |
.pipe(gulp.dest(paths.styles.output)); | |
}); | |
// Generate SVG sprites | |
gulp.task('build:svgs', function () { | |
return gulp.src(paths.svgs.input) | |
.pipe(plumber()) | |
.pipe(tap(function (file, t) { | |
if ( file.isDirectory() ) { | |
var name = file.relative + '.svg'; | |
return gulp.src(file.path + '/*.svg') | |
.pipe(svgmin()) | |
.pipe(svgstore({ | |
fileName: name, | |
prefix: 'icon-', | |
inlineSvg: true | |
})) | |
.pipe(gulp.dest(paths.svgs.output)); | |
} | |
})) | |
.pipe(svgmin()) | |
.pipe(svgstore({ | |
fileName: 'icons.svg', | |
prefix: 'icon-', | |
inlineSvg: true | |
})) | |
.pipe(gulp.dest(paths.svgs.output)); | |
}); | |
// Copy static files into output folder | |
gulp.task('copy:static', function() { | |
return gulp.src(paths.static) | |
.pipe(plumber()) | |
.pipe(gulp.dest(paths.output)); | |
}); | |
// Lint scripts | |
gulp.task('lint:scripts', function () { | |
return gulp.src(paths.scripts.input) | |
.pipe(plumber()) | |
.pipe(jshint()) | |
.pipe(jshint.reporter('jshint-stylish')); | |
}); | |
// Remove prexisting content from output and test folders | |
gulp.task('clean:dist', function () { | |
del.sync([ | |
paths.output, | |
paths.test.coverage, | |
paths.test.results | |
]); | |
}); | |
// Run unit tests | |
gulp.task('test:scripts', function() { | |
return gulp.src([paths.test.input].concat([paths.test.spec])) | |
.pipe(plumber()) | |
.pipe(karma({ configFile: paths.test.karma })) | |
.on('error', function(err) { throw err; }); | |
}); | |
// Generate documentation | |
gulp.task('build:docs', ['compile'], function() { | |
return gulp.src(paths.docs.input) | |
.pipe(plumber()) | |
.pipe(fileinclude({ | |
prefix: '@@', | |
basepath: '@file' | |
})) | |
.pipe(tap(function (file, t) { | |
if ( /\.md|\.markdown/.test(file.path) ) { | |
return t.through(markdown); | |
} | |
})) | |
.pipe(header(fs.readFileSync(paths.docs.templates + '/_header.html', 'utf8'))) | |
.pipe(footer(fs.readFileSync(paths.docs.templates + '/_footer.html', 'utf8'))) | |
.pipe(gulp.dest(paths.docs.output)); | |
}); | |
// Copy distribution files to docs | |
gulp.task('copy:dist', ['compile'], function() { | |
return gulp.src(paths.output + '/**') | |
.pipe(plumber()) | |
.pipe(gulp.dest(paths.docs.output + '/dist')); | |
}); | |
// Copy documentation assets to docs | |
gulp.task('copy:assets', function() { | |
return gulp.src(paths.docs.assets) | |
.pipe(plumber()) | |
.pipe(gulp.dest(paths.docs.output + '/assets')); | |
}); | |
// Spin up livereload server and listen for file changes | |
gulp.task('listen', function () { | |
livereload.listen(); | |
gulp.watch(paths.input).on('change', function(file) { | |
gulp.start('default'); | |
gulp.start('refresh'); | |
}); | |
}); | |
// Run livereload after file change | |
gulp.task('refresh', ['compile'], function () { | |
livereload.changed(); | |
}); | |
/** | |
* Task Runners | |
*/ | |
// Compile files | |
gulp.task('compile', [ | |
'lint:scripts', | |
'copy:static', | |
'build:scripts', | |
'build:svgs', | |
'build:styles' | |
]); | |
// Generate documentation | |
gulp.task('docs', [ | |
'clean:docs', | |
'build:docs', | |
'copy:dist', | |
'copy:assets' | |
]); | |
// Generate documentation | |
gulp.task('tests', [ | |
'test:scripts' | |
]); | |
// Compile files, generate docs, and run unit tests (default) | |
gulp.task('default', [ | |
'compile', | |
]); | |
// Compile files, generate docs, and run unit tests when something changes | |
gulp.task('watch', [ | |
'listen', | |
'default' | |
]); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment