grunt使用小记

1.安装nodejs,从nodejs官网上wget

2.把nodejs的bin目录加进PATH

3.切到项目目录

4.核心配置package.json、Gruntfile.js

5.package.json:

{
  "name": "oauth",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "~0.4.5",
    "grunt-contrib-jshint": "~0.10.0",
    "grunt-contrib-nodeunit": "~0.4.1",
    "grunt-contrib-uglify": "~0.5.0"
  }
}

6.用npm安装依赖时加上命令--save-dev可以给配置文件里写入依赖项,比如npm install grunt --save-dev

7.Gruntfile.js:

module.exports = function(grunt){

    // 项目配置
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        uglify: {
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */
'//添加banner
            },
            builda: {//任务一:压缩a.js,不混淆变量名,保留注释,添加banner和footer
                options: {
                    mangle: false, //不混淆变量名
                    preserveComments: 'all', //不删除注释,还可以为 false(删除全部注释),some(保留@preserve @license @cc_on等注释)
                    footer:'
/*! <%= pkg.name %> 最后修改于: <%= grunt.template.today("yyyy-mm-dd") %> */'//添加footer
                },
                files: {
                    'output/js/a.min.js': ['js/a.js']
                }
            },
            buildb:{//任务二:压缩b.js,输出压缩信息
                options: {
                    report: "min"//输出压缩率,可选的值有 false(不输出信息),gzip
                },
                files: {
                    'output/js/b.min.js': ['js/main/b.js']
                }
            },
            buildall: {//任务三:按原文件结构压缩js文件夹内所有JS文件
                files: [{
                    expand:true,
                    cwd:'js',//js目录下
                    src:'**/*.js',//所有js文件
                    dest: 'output/js'//输出到此目录下
                }]
            },
            release: {//任务四:合并压缩a.js和b.js
                files: {
                    'output/js/index.min.js': ['js/a.js', 'js/main/b.js']
                }
            }
        }
    });

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

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

8.在项目目录下运行grunt [task] task可以在Gruntfile.js里注册

 

nothing is impossible,but how long it take
原文地址:https://www.cnblogs.com/gavinphp/p/4789132.html