在没有所有非生产文件的情况下生成聚合物应用程序的zip
Generate zip of polymer app without all the non-production files
如果您使用bower设置Polymer应用程序,您将获得无数不需要的文件。想想
- 未导入的标记
- README.md和大多数
/bower_components/
中的文档 - 大多数
/bower_components/
中的演示文件
如果你在http服务器上运行它,这并不重要,但如果你想把它捆绑成一个打包的应用程序,它确实变得很重要。现在,使用vulcanize
可以内联所有的html标记,但是生成的文件仍然有类似的引用
<polymer-element [...] assetpath="bower_components/core-icon/">
因此根本没有真正解决问题。我很难相信我是唯一一个遇到这个问题的人,那么我是做错了什么?
您可以使用Grunt生成生产代码。我给你附上了一个基本的grunt配置,这将对你有所帮助。
该脚本假设了以下grunt插件:
grunt-contrib-clean
grunt-contrib-concat
grunt-cssc
grunt-dom-munger
matchdep
示例grunt.js:
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
dom_munger: {
read: {
options: {
read: [
{selector: 'link', attribute: 'href', writeto: 'CssRefs', isPath: true},
{selector: 'script[src]', attribute: 'src', writeto: 'JsRefs', isPath: true}
]
},
src: 'src/index.html'
},
urlRewrite: {
options: {
remove: ['link', 'script'],
append: [
{selector: 'head', html: '<link href="style/screen.css" rel="stylesheet" />'},
{selector: 'body', html: '<script src="script/main.app"></script>'}
]
},
src: ['dist/index.html']
}
},
concat: {
options: {
separator: ';'
},
dist: {
files: {
'dist/script/main.js': ['<%= dom_munger.data.JsRefs %>']
}
}
},
cssc: {
dist: {
options: {
sortSelectors: false,
lineBreaks: false,
sortDeclarations: false,
consolidateViaDeclarations: false,
consolidateViaSelectors: false,
consolidateMediaQueries: false
},
files: {
'dist/style/screen.css': ['<%= dom_munger.data.CssRefs %>']
}
}
},
clean: {
dist: {
src: ['dist']
}
}
}
);
//Load all required grunt plugins
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
//Custom Tasks
grunt.registerTask('default', ['clean', 'dom_munger:read', 'concat', 'cssc', 'dom_munger:urlRewrite']);
};
这只是一个基本的例子,您可以根据自己的需要进行扩展。
相关文章:
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- Emberjs应用程序加载在除Index之外的所有路由上
- 使用电话间隙在Android应用程序中显示SQL Lite的数据
- 在AngularJS应用程序中使用封装指令和路由的推荐方式是什么
- Windows8应用程序(html&Javascript):从图片库(除了文件选择器)显示图像的另一种方式
- angular 1.5应用程序中的导航栏
- 在Web应用程序中使用Highcharts javascript
- angularjs+rails应用程序中未显示模板
- 使用acess代币登录Facebook,并通过网络应用程序离线发布
- 从HTTPGET返回一个自定义对象列表,以便在Angular 2应用程序中使用
- 科尔多瓦页面类应用程序中的多个谷歌地图
- 使用谷歌应用程序脚本将服务器端数据表返回到客户端
- Angularjs-utils高亮过滤器在搜索时破坏应用程序
- 基于 REST 的聚合物应用程序
- 如何为自定义聚合物元素创建方法并在主应用程序中调用它
- 在没有所有非生产文件的情况下生成聚合物应用程序的zip
- 数据不绑定在聚合物应用程序
- 聚合物单页应用程序不工作
- 如何改变一个属性的聚合物元素与jquery?(修复加载时应用程序抽屉故障)
- 聚合物1.6和聚合物-cli,从自定义元素中访问应用程序属性