grunt 相关知识

/**
 * Created by lee on 2014.07.02 002.
 */
module.exports = function (grunt) {

    // 项目配置
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        uglify: {
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'//添加banner
            },
            //任务一：压缩a.js，不混淆变量名，保留注释，添加banner和footer
            builda: {
                options: {
                    mangle: false, //不混淆变量名
                    preserveComments: 'all', //不删除注释，还可以为 false（删除全部注释），some（保留@preserve @license @cc_on等注释）
                    footer: '\n/*! <%= pkg.name %> 最后修改于： <%= grunt.template.today("yyyy-mm-dd") %> */'//添加footer
                },
                files: {
                    'output/js/a.min.js': ['js/a.js']
                }
            },
            //任务二：压缩b.js，输出压缩信息
            buildb: {
                options: {
                    report: "min"//输出压缩率，可选的值有 false(不输出信息)，gzip
                },
                files: {
                    'output/js/b.min.js': ['js/main/b.js']
                }
            },
            //任务三：按原文件结构压缩js文件夹内所有JS文件
            buildall: {
                files: [
                    {
                        expand: true,
                        cwd: 'js',//js目录下
                        src: '**/*.js',//所有js文件
                        dest: 'output/js'//输出到此目录下
                    }
                ]
            },
            //任务四：合并压缩a.js和b.js
            release: {
                files: {
                    'output/js/index.min.js': ['js/a.js', 'js/main/b.js']
                }
            }
        },
        filerev: {
            dist: {
                src: [
                    '<%= pkg.dist %>/scripts/{,*/}*.js',
                    '<%= pkg.dist %>/styles/{,*/}*.css',
                    '<%= pkg.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
                    '<%= pkg.dist %>/styles/fonts/*'
                ]
            }
        },
        copy: {
            dist: {
                files: [
                    {
                        expand: true,
                        dot: true,
                        cwd: '<%= pkg.app %>',
                        dest: '<%= pkg.dist %>',
                        src: [
                            '*.{ico,png,txt}',
                            '.htaccess',
                            '*.html',
                            'views/{,*/}*.html',
                            'images/{,*/}*.{webp}',
                            'fonts/*'
                        ]
                    }
                ]
            },
            styles: {
                expand: true,
                cwd: '<%= pkg.app %>/styles',
                dest: '<%= pkg.dist %>/styles',
                src: '{,*/}*.css'
            },
            script: {
                expand: true,
                cwd: '<%= pkg.app %>/scripts',
                dest: '<%= pkg.dist %>/scripts',
                src: '{,*/}*.js'
            }
        },
        useminPrepare: {
            html: '<%= pkg.app %>/index.html',
            options: {
                dest: '<%= pkg.dist %>',
                flow: {
                    html: {
                        steps: {
                            js: ['concat', 'uglifyjs']
                        },
                        post: {}
                    }
                }
            }
        },

        // Performs rewrites based on filerev and the useminPrepare configuration
        usemin: {
            html: ['<%= pkg.dist %>/{,*/}*.html'],
            css: ['<%= pkg.dist %>/styles/{,*/}*.css'],
            options: {
                assetsDirs: ['<%= pkg.dist %>','<%= pkg.dist %>/images']
            }
        }
    });

    // 加载提供任务的插件
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-filerev');
    grunt.loadNpmTasks('grunt-usemin');

    // 默认任务
    grunt.registerTask('default', ['uglify:release']);
    grunt.registerTask('mina', ['uglify:builda']);
    grunt.registerTask('minb', ['uglify:buildb']);
    grunt.registerTask('minall', ['uglify:buildall']);
    grunt.registerTask('build', ['uglify:buildall']);
}

 

 

这里主要使用的是  grunt-contrib-uglify  使用了文件压缩和文件合并;

pkg: grunt.file.readJSON('package.json'),

读取packages.json 文件里面的信息.

配置任务,使用uglify在里面配置任务 如上文件的 builda,buildb,buildall;

对于每个任务可配置的: 详细阅读 github uglify  doc 

  demotask:{
                options: {
　　　　　　　　　　　 report: "min",//输出压缩率，可选的值有 false(不输出信息)，gzip
                    mangle: false, //是否混淆变量名 默认false 添加  except: ['jQuery', 'Backbone'] 例外 ;不要混淆替换jQuery 和Backbone
                    //对压缩方式控制 去掉 console.* 方法
                    compress: {
                        drop_console: true
                    },
                    preserveComments: 'all', //不删除注释，还可以为 false（删除全部注释），some（保留@preserve @license @cc_on等注释）
                    footer:'\n/*! <%= pkg.name %> 最后修改于： <%= grunt.template.today("yyyy-mm-dd") %> */'//添加footer
                },
                files: [{
                    expand:true,
                    cwd:'js',//js目录下
                    src:'**/*.js',//所有js文件
                    dest: 'output/js'//输出到此目录下
                }]
            }