8c14386ea7
With Buck, we won't easily be able to follow the <!-- build:js --> directive in index.html to combine multiple .js files into a single app.js. Instead, move those includes into the top-level component gr-app.html, so vulcanize will simply inline them. This leaves index.html as a simple unvulcanized shim that will just load the polyfills and the top-level app. After this change, we can vulcanize gr-app.html and just swap out one path in index.html, otherwise serving it as-is. Change-Id: I782c4bbd259c03c2d7e2d33342462510a91f32e3
178 lines
4.9 KiB
JavaScript
178 lines
4.9 KiB
JavaScript
// Copyright (C) 2015 The Android Open Source Project
|
|
//
|
|
// 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
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// 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.
|
|
|
|
'use strict';
|
|
|
|
// Include Gulp & tools we'll use
|
|
var gulp = require('gulp');
|
|
var $ = require('gulp-load-plugins')();
|
|
var del = require('del');
|
|
var runSequence = require('run-sequence');
|
|
var merge = require('merge-stream');
|
|
var path = require('path');
|
|
var historyApiFallback = require('connect-history-api-fallback');
|
|
|
|
var AUTOPREFIXER_BROWSERS = [
|
|
'ie >= 10',
|
|
'ie_mob >= 10',
|
|
'ff >= 30',
|
|
'chrome >= 34',
|
|
'safari >= 7',
|
|
'opera >= 23',
|
|
'ios >= 7',
|
|
'android >= 4.4',
|
|
'bb >= 10'
|
|
];
|
|
|
|
var styleTask = function (stylesPath, srcs) {
|
|
return gulp.src(srcs.map(function(src) {
|
|
return path.join('app', stylesPath, src);
|
|
}))
|
|
.pipe($.changed(stylesPath, {extension: '.css'}))
|
|
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
|
.pipe(gulp.dest('.tmp/' + stylesPath))
|
|
.pipe($.cssmin())
|
|
.pipe(gulp.dest('dist/' + stylesPath))
|
|
.pipe($.size({title: stylesPath}));
|
|
};
|
|
|
|
var imageOptimizeTask = function (src, dest) {
|
|
return gulp.src(src)
|
|
.pipe($.cache($.imagemin({
|
|
progressive: true,
|
|
interlaced: true
|
|
})))
|
|
.pipe(gulp.dest(dest))
|
|
.pipe($.size({title: 'images'}));
|
|
};
|
|
|
|
var optimizeHtmlTask = function (src, dest) {
|
|
var assets = $.useref.assets({searchPath: ['.tmp', 'app', 'dist']});
|
|
|
|
return gulp.src(src)
|
|
// Replace path for vulcanized assets
|
|
.pipe($.if('*.html', $.replace('elements/gr-app.html', 'elements/gr-app.vulcanized.html')))
|
|
.pipe(assets)
|
|
// Concatenate and minify JavaScript
|
|
.pipe($.if('*.js', $.uglify({preserveComments: 'some'})))
|
|
// Concatenate and minify styles
|
|
// In case you are still using useref build blocks
|
|
.pipe($.if('*.css', $.cssmin()))
|
|
.pipe(assets.restore())
|
|
.pipe($.useref())
|
|
// Minify any HTML
|
|
.pipe($.if('*.html', $.minifyHtml({
|
|
quotes: true,
|
|
empty: true,
|
|
spare: true
|
|
})))
|
|
// Output files
|
|
.pipe(gulp.dest(dest))
|
|
.pipe($.size({title: 'html'}));
|
|
};
|
|
|
|
// Compile and automatically prefix stylesheets
|
|
gulp.task('styles', function () {
|
|
return styleTask('styles', ['**/*.css']);
|
|
});
|
|
|
|
gulp.task('elements', function () {
|
|
return styleTask('elements', ['**/*.css']);
|
|
});
|
|
|
|
// Optimize images
|
|
gulp.task('images', function () {
|
|
return imageOptimizeTask('app/images/**/*', 'dist/images');
|
|
});
|
|
|
|
// Copy all files at the root level (app)
|
|
gulp.task('copy', function () {
|
|
var app = gulp.src([
|
|
'app/*',
|
|
'!app/test'
|
|
], {
|
|
dot: true
|
|
}).pipe(gulp.dest('dist'));
|
|
|
|
var bower = gulp.src([
|
|
'bower_components/**/*'
|
|
]).pipe(gulp.dest('dist/bower_components'));
|
|
|
|
var elements = gulp.src(['app/elements/**/*.html',
|
|
'app/elements/**/*.css',
|
|
'app/elements/**/*.js'])
|
|
.pipe(gulp.dest('dist/elements'));
|
|
|
|
var scripts = gulp.src(['app/scripts/**/*.js'])
|
|
.pipe(gulp.dest('dist/scripts'));
|
|
|
|
var vulcanized = gulp.src(['app/elements/gr-app.html'])
|
|
.pipe($.rename('gr-app.vulcanized.html'))
|
|
.pipe(gulp.dest('dist/elements'));
|
|
|
|
return merge(app, bower, elements, scripts, vulcanized)
|
|
.pipe($.size({title: 'copy'}));
|
|
});
|
|
|
|
// Copy web fonts to dist
|
|
gulp.task('fonts', function () {
|
|
return gulp.src(['app/fonts/**'])
|
|
.pipe(gulp.dest('dist/fonts'))
|
|
.pipe($.size({title: 'fonts'}));
|
|
});
|
|
|
|
// Scan your HTML for assets & optimize them
|
|
gulp.task('html', function () {
|
|
return optimizeHtmlTask(
|
|
['app/**/*.html', '!app/{elements,test}/**/*.html'],
|
|
'dist');
|
|
});
|
|
|
|
// Vulcanize granular configuration.
|
|
gulp.task('vulcanize', function () {
|
|
var DEST_DIR = 'dist/elements';
|
|
return gulp.src('dist/elements/gr-app.vulcanized.html')
|
|
.pipe($.vulcanize({
|
|
stripComments: true,
|
|
inlineCss: true,
|
|
inlineScripts: true
|
|
}))
|
|
.pipe(gulp.dest(DEST_DIR))
|
|
.pipe($.size({title: 'vulcanize'}));
|
|
});
|
|
|
|
// Clean output directory
|
|
gulp.task('clean', function (cb) {
|
|
del(['.tmp', 'dist'], cb);
|
|
});
|
|
|
|
|
|
// Build production files, the default task
|
|
gulp.task('default', ['clean'], function (cb) {
|
|
// Uncomment 'cache-config' if you are going to use service workers.
|
|
runSequence(
|
|
['copy', 'styles'],
|
|
'elements',
|
|
['images', 'fonts', 'html'],
|
|
'vulcanize', // 'cache-config',
|
|
cb);
|
|
});
|
|
|
|
// Load tasks for web-component-tester
|
|
// Adds tasks for `gulp test:local` and `gulp test:remote`
|
|
require('web-component-tester').gulp.init(gulp);
|
|
|
|
// Load custom tasks from the `tasks` directory
|
|
try { require('require-dir')('tasks'); } catch (err) {}
|