如何用grunt压缩文件

 grunt-cli 全局装完之后，就可以给每个项目装grunt了。

 

1.先把package.json和Gruntfile.js拷到项目下（PS：这两个文件是每个项目装grunt的时候必带的）

package.json 内容如下：

{
  "name": "rk",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "^1.0.1",
    "grunt-contrib-uglify": "^2.0.0",
    "grunt-contrib-concat": "~0.1.1",
    "grunt-css":">0.0.0",
   "grunt-contrib-cssmin": "~0.5.0"
  }
}

Gruntfile.js 内容如下：

module.exports = function (grunt) {
    // 构建任务配置
    grunt.initConfig({
        //读取package.json的内容，形成个json数据
        pkg: grunt.file.readJSON('package.json'),
        //压缩js
        uglify: {
            //文件头部输出信息
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */
'
            },
            my_target: {
                files: [
                    {
                        expand: true,
                        //相对路径
                        cwd: 'js/',
                        src: ['*.js','*/*.js','*/*/*.js','*/*/*/*.js','*/*/*/*/*.js'],
                        dest: 'dest/js/',
                        rename: function (dest, src) {  
                                  var folder = src.substring(0, src.lastIndexOf('/'));  
                                  var filename = src.substring(src.lastIndexOf('/'), src.length);  
                                  //  var filename=src;  
                                  filename = filename.substring(0, filename.lastIndexOf('.'));  
                                  var fileresult=dest + folder + filename + '.js';  
                                  grunt.log.writeln("现处理文件："+src+"  处理后文件："+fileresult);  
                                  return fileresult;  
                                  //return  filename + '.min.js';  
                              } 
                    }
                ]
            }
        },
        //压缩css
        cssmin: {
            //文件头部输出信息
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */
',
                //美化代码
                beautify: {
                    //中文ascii化，非常有用！防止中文乱码的神配置
                    ascii_only: true
                }
            },
            my_target: {
                files: [
                    {
                        expand: true,
                        //相对路径
                        cwd: 'css/',
                        src: ['*.css','*/*.css','*/*/*.css','*/*/*/*.css'],
                        dest: 'dest/cssmin/',
                        rename: function (dest, src) {  
                                var folder = src.substring(0, src.lastIndexOf('/'));  
                                var filename = src.substring(src.lastIndexOf('/'), src.length);  
                                //  var filename=src;  
                                filename = filename.substring(0, filename.lastIndexOf('.'));  
                                var fileresult=dest + folder + filename + '.css';  
                                grunt.log.writeln("现处理文件："+src+"  处理后文件："+fileresult);  
                                return fileresult;  
                              //return  filename + '.min.js';
                                }
                    }
                ]
            }
        }
    });
    // 加载指定插件任务
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    // 默认执行的任务
    grunt.registerTask('default', ['uglify', 'cssmin']);
};

2.cmd进入到项目目录下然后执行“npm install”，命令执行完毕之后就可以把代码拷贝到根目录下。

3.cmd中执行“grunt”

4.ok,静静等待需要压缩的文件批量压缩好吧