Skip to content

Instantly share code, notes, and snippets.

@simonwoo
Last active November 5, 2016 19:13
Show Gist options
  • Save simonwoo/6f3a73c20966642261309ea097db46a8 to your computer and use it in GitHub Desktop.
Save simonwoo/6f3a73c20966642261309ea097db46a8 to your computer and use it in GitHub Desktop.
// generated on <%= date %> using <%= name %> <%= version %>
const gulp = require('gulp');
const gulpLoadPlugins = require('gulp-load-plugins');
const browserSync = require('browser-sync');
const del = require('del');
const wiredep = require('wiredep').stream;
const runSequence = require('run-sequence');
const $ = gulpLoadPlugins();
const reload = browserSync.reload;
var dev = true;
gulp.task('styles', () => {<% if (includeSass) { %>
return gulp.src('app/styles/*.scss')
.pipe($.plumber())
.pipe($.sourcemaps.init())
.pipe($.sass.sync({
outputStyle: 'expanded',
precision: 10,
includePaths: ['.']
}).on('error', $.sass.logError))<% } else { %>
return gulp.src('app/styles/*.css')
.pipe($.sourcemaps.init())<% } %>
.pipe($.autoprefixer({browsers: ['> 1%', 'last 2 versions', 'Firefox ESR']}))
.pipe($.sourcemaps.write())
.pipe(gulp.dest('.tmp/styles'))
.pipe(reload({stream: true}));
});
<% if (includeBabel) { -%>
gulp.task('scripts', () => {
return gulp.src('app/scripts/**/*.js')
.pipe($.plumber())
.pipe($.sourcemaps.init())
.pipe($.babel())
.pipe($.sourcemaps.write('.'))
.pipe(gulp.dest('.tmp/scripts'))
.pipe(reload({stream: true}));
});
<% } -%>
function lint(files, options) {
return gulp.src(files)
.pipe(reload({stream: true, once: true}))
.pipe($.eslint(options))
.pipe($.eslint.format())
.pipe($.if(!browserSync.active, $.eslint.failAfterError()));
}
gulp.task('lint', () => {
return lint('app/scripts/**/*.js', {
fix: true
})
.pipe(gulp.dest('app/scripts'));
});
gulp.task('lint:test', () => {
return lint('test/spec/**/*.js', {
fix: true,
env: {
<% if (testFramework === 'mocha') { -%>
mocha: true
<% } else if (testFramework === 'jasmine') { -%>
jasmine: true
<% } -%>
}
})
.pipe(gulp.dest('test/spec'));
});
<% if (includeBabel) { -%>
gulp.task('html', ['styles', 'scripts'], () => {
<% } else { -%>
gulp.task('html', ['styles'], () => {
<% } -%>
return gulp.src('app/*.html')
.pipe($.useref({searchPath: ['.tmp', 'app', '.']}))
.pipe($.if('*.js', $.uglify()))
.pipe($.if('*.css', $.cssnano({safe: true, autoprefixer: false})))
.pipe($.if('*.html', $.htmlmin({collapseWhitespace: true})))
.pipe(gulp.dest('dist'));
});
gulp.task('images', () => {
return gulp.src('app/images/**/*')
.pipe($.cache($.imagemin()))
.pipe(gulp.dest('dist/images'));
});
gulp.task('fonts', () => {
return gulp.src(require('main-bower-files')('**/*.{eot,svg,ttf,woff,woff2}', function (err) {})
.concat('app/fonts/**/*'))
.pipe($.if(dev, gulp.dest('.tmp/fonts'), gulp.dest('dist/fonts')));
});
gulp.task('extras', () => {
return gulp.src([
'app/*',
'!app/*.html'
], {
dot: true
}).pipe(gulp.dest('dist'));
});
gulp.task('clean', del.bind(null, ['.tmp', 'dist']));
gulp.task('serve', () => {
runSequence(['clean', 'wiredep'], ['styles'<% if (includeBabel) { %>, 'scripts'<% } %>, 'fonts'], () => {
browserSync({
notify: false,
port: 9000,
server: {
baseDir: ['.tmp', 'app'],
routes: {
'/bower_components': 'bower_components'
}
}
});
gulp.watch([
'app/*.html',
<% if (!includeBabel) { -%>
'app/scripts/**/*.js',
<% } -%>
'app/images/**/*',
'.tmp/fonts/**/*'
]).on('change', reload);
gulp.watch('app/styles/**/*.<%= includeSass ? 'scss' : 'css' %>', ['styles']);
<% if (includeBabel) { -%>
gulp.watch('app/scripts/**/*.js', ['scripts']);
<% } -%>
gulp.watch('app/fonts/**/*', ['fonts']);
gulp.watch('bower.json', ['wiredep', 'fonts']);
});
});
gulp.task('serve:dist', ['default'], () => {
browserSync({
notify: false,
port: 9000,
server: {
baseDir: ['dist']
}
});
});
<% if (includeBabel) { -%>
gulp.task('serve:test', ['scripts'], () => {
<% } else { -%>
gulp.task('serve:test', () => {
<% } -%>
browserSync({
notify: false,
port: 9000,
ui: false,
server: {
baseDir: 'test',
routes: {
<% if (includeBabel) { -%>
'/scripts': '.tmp/scripts',
<% } else { -%>
'/scripts': 'app/scripts',
<% } -%>
'/bower_components': 'bower_components'
}
}
});
<% if (includeBabel) { -%>
gulp.watch('app/scripts/**/*.js', ['scripts']);
<% } -%>
gulp.watch(['test/spec/**/*.js', 'test/index.html']).on('change', reload);
gulp.watch('test/spec/**/*.js', ['lint:test']);
});
// inject bower components
gulp.task('wiredep', () => {<% if (includeSass) { %>
gulp.src('app/styles/*.scss')
.pipe(wiredep({
ignorePath: /^(\.\.\/)+/
}))
.pipe(gulp.dest('app/styles'));
<% } %>
gulp.src('app/*.html')
.pipe(wiredep({<% if (includeBootstrap) { if (includeSass) { %>
exclude: ['bootstrap-sass'],<% } else { %>
exclude: ['bootstrap.js'],<% }} %>
ignorePath: /^(\.\.\/)*\.\./
}))
.pipe(gulp.dest('app'));
});
gulp.task('build', ['lint', 'html', 'images', 'fonts', 'extras'], () => {
return gulp.src('dist/**/*').pipe($.size({title: 'build', gzip: true}));
});
gulp.task('default', () => {
return new Promise(resolve => {
dev = false;
runSequence(['clean', 'wiredep'], 'build', resolve);
});
});
{
"private": true,
"engines": {
"node": ">=4"
},
"devDependencies": {
"babel-core": "^6.4.0",
"babel-preset-es2015": "^6.3.13",
"babel-register": "^6.5.2",
"browser-sync": "^2.2.1",
"del": "^2.2.0",
"gulp": "^3.9.0",
"gulp-autoprefixer": "^3.0.1",<% if (includeBabel) { %>
"gulp-babel": "^6.1.1",<% } %>
"gulp-cache": "^0.4.2",
"gulp-cssnano": "^2.0.0",
"gulp-eslint": "^3.0.0",
"gulp-htmlmin": "^3.0.0",
"gulp-if": "^2.0.0",
"gulp-imagemin": "^3.0.1",
"gulp-load-plugins": "^1.2.4",<% if (includeBabel || includeSass) { %>
"gulp-plumber": "^1.0.1",<% } if (includeSass) { %>
"gulp-sass": "^2.0.0",<% } %>
"gulp-size": "^2.1.0",
"gulp-sourcemaps": "^1.5.0",
"gulp-uglify": "^2.0.0",
"gulp-useref": "^3.0.0",
"main-bower-files": "^2.5.0",
"run-sequence": "^1.2.2",
"wiredep": "^4.0.0"
},
"eslintConfig": {
"env": {<% if (includeBabel) { %>
"es6": true,<% } %>
"node": true,
"browser": true
},
"rules": {
"quotes": [
2,
"single"
]
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment