2014-06-09 17:02:39 +04:00
|
|
|
/**
|
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
* Web Starter Kit
|
|
|
|
* Copyright 2014 Google Inc. All rights reserved.
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
* you may not use this file except in compliance with the License.
|
|
|
|
* You may obtain a copy of the License at
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
* See the License for the specific language governing permissions and
|
|
|
|
* limitations under the License
|
2014-06-09 17:02:39 +04:00
|
|
|
*
|
2014-06-09 12:56:26 +04:00
|
|
|
*/
|
2014-06-09 17:02:39 +04:00
|
|
|
|
2014-04-17 16:02:38 +04:00
|
|
|
'use strict';
|
2014-06-19 16:14:21 +04:00
|
|
|
|
|
|
|
// Include Gulp & Tools We'll Use
|
2014-04-17 16:02:38 +04:00
|
|
|
var gulp = require('gulp');
|
2014-06-07 21:38:49 +04:00
|
|
|
var $ = require('gulp-load-plugins')();
|
2014-06-22 00:32:57 +04:00
|
|
|
var del = require('del');
|
2014-06-19 05:37:49 +04:00
|
|
|
var runSequence = require('run-sequence');
|
2014-05-06 16:47:36 +04:00
|
|
|
var browserSync = require('browser-sync');
|
2014-06-06 14:59:34 +04:00
|
|
|
var pagespeed = require('psi');
|
2014-05-06 16:47:36 +04:00
|
|
|
var reload = browserSync.reload;
|
2014-04-17 16:02:38 +04:00
|
|
|
|
2014-07-04 15:35:14 +04:00
|
|
|
var AUTOPREFIXER_BROWSERS = [
|
|
|
|
'ie >= 10',
|
|
|
|
'ie_mob >= 10',
|
|
|
|
'ff >= 30',
|
|
|
|
'chrome >= 34',
|
|
|
|
'safari >= 7',
|
|
|
|
'opera >= 23',
|
|
|
|
'ios >= 7',
|
|
|
|
'android >= 4.4',
|
|
|
|
'bb >= 10'
|
|
|
|
];
|
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Lint JavaScript
|
|
|
|
gulp.task('jshint', function () {
|
2014-06-20 19:20:44 +04:00
|
|
|
return gulp.src('app/scripts/**/*.js')
|
2014-06-26 23:32:04 +04:00
|
|
|
.pipe(reload({stream: true, once: true}))
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe($.jshint())
|
|
|
|
.pipe($.jshint.reporter('jshint-stylish'))
|
2014-06-26 23:32:04 +04:00
|
|
|
.pipe($.if(!browserSync.active, $.jshint.reporter('fail')));
|
2014-06-19 16:14:21 +04:00
|
|
|
});
|
2014-05-07 13:33:42 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Optimize Images
|
|
|
|
gulp.task('images', function () {
|
2014-06-20 19:20:44 +04:00
|
|
|
return gulp.src('app/images/**/*')
|
|
|
|
.pipe($.cache($.imagemin({
|
|
|
|
progressive: true,
|
|
|
|
interlaced: true
|
|
|
|
})))
|
|
|
|
.pipe(gulp.dest('dist/images'))
|
|
|
|
.pipe($.size({title: 'images'}));
|
2014-06-19 16:14:21 +04:00
|
|
|
});
|
|
|
|
|
2014-06-28 06:20:04 +04:00
|
|
|
// Copy All Files At The Root Level (app)
|
|
|
|
gulp.task('copy', function() {
|
|
|
|
return gulp.src(['app/*', '!app/*.html'])
|
|
|
|
.pipe(gulp.dest('dist'))
|
|
|
|
.pipe($.size({title: 'copy'}));
|
|
|
|
});
|
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Automatically Prefix CSS
|
2014-06-19 15:21:01 +04:00
|
|
|
gulp.task('styles:css', function () {
|
2014-06-20 19:20:44 +04:00
|
|
|
return gulp.src('app/styles/**/*.css')
|
2014-06-22 03:38:12 +04:00
|
|
|
.pipe($.changed('app/styles'))
|
2014-07-04 15:35:14 +04:00
|
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe(gulp.dest('app/styles'))
|
|
|
|
.pipe($.size({title: 'styles:css'}));
|
2014-06-19 15:21:01 +04:00
|
|
|
});
|
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Compile Sass For Style Guide Components (app/styles/components)
|
2014-06-19 05:37:49 +04:00
|
|
|
gulp.task('styles:components', function () {
|
2014-06-20 19:20:44 +04:00
|
|
|
return gulp.src('app/styles/components/components.scss')
|
|
|
|
.pipe($.rubySass({
|
|
|
|
style: 'expanded',
|
|
|
|
precision: 10,
|
|
|
|
loadPath: ['app/styles/components']
|
|
|
|
}))
|
2014-07-04 15:36:23 +04:00
|
|
|
.on('error', console.error.bind(console))
|
2014-07-04 15:35:14 +04:00
|
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe(gulp.dest('app/styles/components'))
|
|
|
|
.pipe($.size({title: 'styles:components'}));
|
2014-06-19 18:42:10 +04:00
|
|
|
});
|
2014-06-19 05:37:49 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Compile Any Other Sass Files You Added (app/styles)
|
2014-06-19 05:37:49 +04:00
|
|
|
gulp.task('styles:scss', function () {
|
2014-06-20 19:20:44 +04:00
|
|
|
return gulp.src(['app/styles/**/*.scss', '!app/styles/components/components.scss'])
|
|
|
|
.pipe($.rubySass({
|
|
|
|
style: 'expanded',
|
|
|
|
precision: 10,
|
|
|
|
loadPath: ['app/styles']
|
|
|
|
}))
|
2014-07-04 17:55:44 +04:00
|
|
|
.on('error', console.error.bind(console))
|
2014-07-04 15:35:14 +04:00
|
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe(gulp.dest('.tmp/styles'))
|
|
|
|
.pipe($.size({title: 'styles:scss'}));
|
2014-06-19 05:37:49 +04:00
|
|
|
});
|
2014-06-18 23:58:06 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Output Final CSS Styles
|
2014-06-19 05:37:49 +04:00
|
|
|
gulp.task('styles', ['styles:components', 'styles:scss', 'styles:css']);
|
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Scan Your HTML For Assets & Optimize Them
|
2014-06-18 23:58:06 +04:00
|
|
|
gulp.task('html', function () {
|
2014-06-20 19:20:44 +04:00
|
|
|
return gulp.src('app/**/*.html')
|
|
|
|
.pipe($.useref.assets({searchPath: '{.tmp,app}'}))
|
|
|
|
// Concatenate And Minify JavaScript
|
2014-06-28 00:56:54 +04:00
|
|
|
.pipe($.if('*.js', $.uglify({preserveComments: 'some'})))
|
2014-06-20 19:20:44 +04:00
|
|
|
// Remove Any Unused CSS
|
|
|
|
// Note: If not using the Style Guide, you can delete it from
|
|
|
|
// the next line to only include styles your project uses.
|
2014-06-30 20:52:51 +04:00
|
|
|
.pipe($.if('*.css', $.uncss({
|
|
|
|
html: [
|
|
|
|
'app/index.html',
|
|
|
|
'app/styleguide/index.html'
|
|
|
|
],
|
|
|
|
// CSS Selectors for UnCSS to ignore
|
|
|
|
ignore: [
|
|
|
|
'.navdrawer-container.open',
|
|
|
|
/.app-bar.open/
|
|
|
|
]
|
|
|
|
})))
|
2014-07-07 16:07:57 +04:00
|
|
|
// Concatenate And Minify Styles
|
|
|
|
.pipe($.if('*.css', $.csso()))
|
2014-06-20 19:20:44 +04:00
|
|
|
.pipe($.useref.restore())
|
|
|
|
.pipe($.useref())
|
|
|
|
// Update Production Style Guide Paths
|
|
|
|
.pipe($.replace('components/components.css', 'components/main.min.css'))
|
|
|
|
// Minify Any HTML
|
2014-07-03 18:36:41 +04:00
|
|
|
.pipe($.if('*.html', $.minifyHtml()))
|
2014-06-20 19:20:44 +04:00
|
|
|
// Output Files
|
|
|
|
.pipe(gulp.dest('dist'))
|
|
|
|
.pipe($.size({title: 'html'}));
|
2014-04-17 16:02:38 +04:00
|
|
|
});
|
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Clean Output Directory
|
2014-06-22 00:32:57 +04:00
|
|
|
gulp.task('clean', del.bind(null, ['.tmp', 'dist']));
|
2014-04-17 16:02:38 +04:00
|
|
|
|
2014-06-19 16:14:21 +04:00
|
|
|
// Watch Files For Changes & Reload
|
2014-06-18 23:58:06 +04:00
|
|
|
gulp.task('serve', function () {
|
2014-06-26 11:10:04 +04:00
|
|
|
browserSync({
|
2014-06-26 02:14:19 +04:00
|
|
|
notify: false,
|
2014-06-20 19:20:44 +04:00
|
|
|
server: {
|
2014-06-26 03:57:36 +04:00
|
|
|
baseDir: ['.tmp', 'app']
|
2014-06-26 02:14:19 +04:00
|
|
|
}
|
2014-06-20 19:20:44 +04:00
|
|
|
});
|
2014-04-17 16:02:38 +04:00
|
|
|
|
2014-06-20 19:20:44 +04:00
|
|
|
gulp.watch(['app/**/*.html'], reload);
|
2014-06-22 03:38:12 +04:00
|
|
|
gulp.watch(['app/styles/**/*.scss'], ['styles:components', 'styles:scss']);
|
|
|
|
gulp.watch(['{.tmp,app}/styles/**/*.css'], ['styles:css', reload]);
|
2014-06-20 19:20:44 +04:00
|
|
|
gulp.watch(['app/scripts/**/*.js'], ['jshint']);
|
2014-06-25 19:07:34 +04:00
|
|
|
gulp.watch(['app/images/**/*'], reload);
|
2014-04-17 16:02:38 +04:00
|
|
|
});
|
2014-06-07 21:38:49 +04:00
|
|
|
|
2014-07-01 00:18:52 +04:00
|
|
|
// Build and serve the output from the dist build
|
2014-07-01 00:23:24 +04:00
|
|
|
gulp.task('serve:dist', ['default'], function () {
|
|
|
|
browserSync({
|
|
|
|
notify: false,
|
2014-07-01 00:18:52 +04:00
|
|
|
server: {
|
2014-07-01 00:23:24 +04:00
|
|
|
baseDir: 'dist'
|
2014-07-01 00:18:52 +04:00
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2014-06-20 03:36:01 +04:00
|
|
|
// Build Production Files, the Default Task
|
2014-06-07 21:38:49 +04:00
|
|
|
gulp.task('default', ['clean'], function (cb) {
|
2014-06-28 06:20:04 +04:00
|
|
|
runSequence('styles', ['jshint', 'html', 'images', 'copy'], cb);
|
2014-06-07 21:38:49 +04:00
|
|
|
});
|
2014-06-19 16:14:21 +04:00
|
|
|
|
2014-06-19 18:42:10 +04:00
|
|
|
// Run PageSpeed Insights
|
2014-06-19 16:14:21 +04:00
|
|
|
// Update `url` below to the public URL for your site
|
|
|
|
gulp.task('pagespeed', pagespeed.bind(null, {
|
2014-06-20 19:20:44 +04:00
|
|
|
// By default, we use the PageSpeed Insights
|
|
|
|
// free (no API key) tier. You can use a Google
|
|
|
|
// Developer API key if you have one. See
|
|
|
|
// http://goo.gl/RkN0vE for info key: 'YOUR_API_KEY'
|
|
|
|
url: 'https://example.com',
|
|
|
|
strategy: 'mobile'
|
2014-06-19 16:14:21 +04:00
|
|
|
}));
|
2014-06-27 22:28:08 +04:00
|
|
|
|
2014-06-27 22:43:40 +04:00
|
|
|
// Load custom tasks from the `tasks` directory
|
|
|
|
try { require('require-dir')('tasks'); } catch (err) {}
|