javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(demos): don't bundle demos when developing

Browse Source 
Rebundling all demos on every change takes 1 minute, only do it for
production.
This commit is contained in:
Tim Lancina
2016-02-18 14:51:55 -06:00
parent 87364db977
commit 1b7cb8ccb0
4 changed files with 67 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
demos/output.ios.scss
View File

@ -1,5 +1,4 @@
$font-path: "/fonts"; $font-path: "../fonts";
$roboto-font-path: "/fonts"; $roboto-font-path: "../fonts";
@import "../ionic/ionic.ios"; @import "../ionic/ionic.ios";

5
demos/output.md.scss
View File

@ -1,5 +1,4 @@
$font-path: "/fonts"; $font-path: "../fonts";
$roboto-font-path: "/fonts"; $roboto-font-path: "../fonts";
@import "../ionic/ionic.md"; @import "../ionic/ionic.md";

28
gulpfile.js
View File

@ -485,10 +485,22 @@ gulp.task('tests', function() {
* Builds Ionic demos to dist/demos, copies them to ../ionic-site and watches * Builds Ionic demos to dist/demos, copies them to ../ionic-site and watches
* for changes. * for changes.
*/ */
gulp.task('watch.demos', ['demos'], function() { //TODO, decide on workflow for site demos (dev and prod), vs local dev (in dist)
watch('demos/**/*', function() { var LOCAL_DEMOS = false;
gulp.start('demos'); gulp.task('watch.demos', function(done) {
LOCAL_DEMOS = true;
runSequence(
['build.demos', 'transpile', 'copy.libs', 'sass', 'fonts'],
function(){
watchTask('bundle.system');
watch('demos/**/*', function(file) {
gulp.start('build.demos');
}); });
done();
}
);
}); });
/** /**
@ -510,6 +522,10 @@ gulp.task('demos', ['bundle.demos'], function() {
return merge([demosStream, cssStream]); return merge([demosStream, cssStream]);
}); });
gulp.task('demos.dev', function() {
});
/** /**
* Builds necessary files for each demo then bundles them using webpack. Unlike * Builds necessary files for each demo then bundles them using webpack. Unlike
* e2e tests, demos are bundled for performance (but have a slower build). * e2e tests, demos are bundled for performance (but have a slower build).
@ -560,10 +576,10 @@ gulp.task('build.demos', function() {
var fs = require('fs'); var fs = require('fs');
var VinylFile = require('vinyl'); var VinylFile = require('vinyl');
var baseIndexTemplate = _.template(fs.readFileSync('scripts/demos/index.template.html'))(); var indexTemplateName = LOCAL_DEMOS ? 'index.template.dev.html' : 'index.template.html';
var flags = minimist(process.argv.slice(2), flagConfig); var baseIndexTemplate = _.template(fs.readFileSync('scripts/demos/' + indexTemplateName))();
if ("production" in flags) { if (flags.production) {
buildDemoSass(true); buildDemoSass(true);
} else { } else {
buildDemoSass(false); buildDemoSass(false);

40
scripts/demos/index.template.dev.html Normal file
View File

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<!-- https://www.chromium.org/developers/design-documents/chromium-graphics/how-to-get-gpu-rasterization -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" type="text/css" href="/dist/demos/scrollbar-fix.css">
<link ios-href="../output.ios.css" rel="stylesheet">
<link md-href="../output.md.css" rel="stylesheet">
<script type="text/javascript" src="/dist/demos/scrollbar-fix.js"></script>
<script src="../../js/es6-shim.min.js"></script>
<script src="../../js/es6-module-loader.src.js"></script>
<script src="../../js/system.src.js"></script>
<script>
System.config({
map: {
angular2: '/angular2',
ionic: '/ionic'
}
});
</script>
<script src="../../js/angular2-polyfills.js"></script>
<script src="../../js/angular2.dev.js"></script>
<script src="../../js/router.dev.js"></script>
<script src="../../js/http.dev.js"></script>
<script src="../../bundles/ionic.system.js"></script>
<script src="../../js/Rx.js"></script>
</head>
<body>
<ion-app>
<ion-loading-icon></ion-loading-icon>
</ion-app>
<script>
System.import('index.js').then(function(m) {}, console.error.bind(console));
</script>
</body>
</html>