在没有所有非生产文件的情况下生成聚合物应用程序的zip

Generate zip of polymer app without all the non-production files

本文关键字:聚合物 应用程序 zip 情况下 非生产 文件      更新时间:2023-09-26

如果您使用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']);
};

这只是一个基本的例子,您可以根据自己的需要进行扩展。