用grunt进行ES6转换，再用uglify压缩所有js实例：http://www.cnblogs.com/moqiutao/p/5316336.html

1.首先安装node.js

去官网下载exe执行文件安装即可，安装完成后自带有npm管理。

2.安装grunt CLI

在项目根文件夹下执行如下代码：

npm install -g grunt-cli

3.安装Grunt

npm install grunt --save-dev

4.配置`Gruntfile.js`

首先需要往项目里添加两个文件：package.json和Gruntfile.js;

如果你从其它项目中拷贝了这2个文件，可以执行npm install直接安装。

其中package.json文件的自动生成：

npm init

grunt.initConfig方法

用于模块配置，它接受一个对象作为参数。该对象的成员与使用的同名模块一一对应。

每个目标的具体设置，需要参考该模板的文档。就cssmin来讲，minify目标的参数具体含义如下：

expand：如果设为true，就表示下面文件名的占位符（即*号）都要扩展成具体的文件名。
cwd：需要处理的文件（input）所在的目录。
src：表示需要处理的文件。如果采用数组形式，数组的每一项就是一个文件名，可以使用通配符。
dest：表示处理后的文件名或所在目录。
ext：表示处理后的文件后缀名。

grunt常用函数

grunt.initConfig：定义各种模块的参数，每一个成员项对应一个同名模块。
grunt.loadNpmTasks：加载完成任务所需的模块。
grunt.registerTask：定义具体的任务。第一个参数为任务名，第二个参数是一个数组，表示该任务需要依次使用的模块。

grunt常用模块

grunt-contrib-clean：删除文件。
grunt-contrib-compass：使用compass编译sass文件。
grunt-contrib-concat：合并文件。
grunt-contrib-copy：复制文件。
grunt-contrib-cssmin：压缩以及合并CSS文件。
grunt-contrib-imagemin：图像压缩模块。
grunt-contrib-jshint：检查JavaScript语法。
grunt-contrib-uglify：压缩以及合并JavaScript文件。
grunt-contrib-watch：监视文件变动，做出相应动作。

常用模块插件的安装方式，进入插件地址搜索想用的插件名称，然后进去查看使用方式，这儿不做介绍。

插件地址：http://gruntjs.com/plugins

5.配置实例

实例需求：需要先把ES6语法转换成ES5，然后通过uglify压缩所有的js。（所有文件在src目录下，里面需要转换的ES6的语法只在某个文件夹下指定文件t.js）。

思路如下：先拷贝所有的src里面的内容到dist文件夹下，在dist文件夹下进行语法转换，再进行js压缩，其中Gruntfile.js配置如下：

    module.exports = function(grunt) {  
      //配置参数  
    grunt.initConfig({  
        pkg: grunt.file.readJSON('package.json'),watch: {
           js: {
            files:['src/**/*.js'],tasks:['default'false}
          },babel:{
              files:'src/**/*.js',tasks:['babel']
          }
        },jshint:{
            build:['src/**/*.js'检测JS代码错误要根据此文件的设置规范进行检测，可以自己修改规则
            }
        },copy: {
          main: {
            expand: true'**']
                
            },dist: {
                files: [{
                   expand:js目录下
                   src:['**/t.js'],1)">所有js文件
                   dest:'dist/'  输出到此目录下
                 }] 
            }
        },uglify: {  
            options: {
             mangle: true,1)">混淆变量名
             comments: 'false' false（删除全部注释），some（保留@preserve @license @cc_on等注释）
            },my_target: {
                 files: [{
                   expand:js目录下
                   src:['**/*.js'],1)">                 }] 
            } 
        }
    });  
      
      载入uglify插件，压缩js 
      grunt.loadNpmTasks('grunt-contrib-copy');
      grunt.loadNpmTasks('grunt-babel');
      grunt.loadNpmTasks('grunt-contrib-jshint');
      grunt.loadNpmTasks('grunt-contrib-uglify'); 
      grunt.loadNpmTasks('grunt-contrib-watch'注册任务  
      grunt.registerTask('default',['copy','babel','uglify']);
      grunt.registerTask('watcher',['watch']);
    }

当然还有一种思路如下：

首先把需要转换的ES6的js通过src目录下，转换到一个中间目录，如babel目录下，然后压缩操作执行两部分，第一部分就是除原src路径下的ES6的js，其它都压缩到dist中，第二部分就是压缩中间目录label下的js，如下配置，只写部分：

babel: {
        options: {
            sourceMap: ]   
        },dist: {
            files: [{
               expand:js目录下
               src:['**/t.js'],1)">所有js文件
               dest:'babel/'               }] 
        }
    },uglify: {  
        options: {
         mangle: 混淆变量名
         comments: 'false'         },my_target: {
             files: [{
               expand:js目录下
               src:['**/*.js'],1)">所有js文件
               dest:'dist/'               }] 
        },allother:{
          files: [{
               expand:js目录下
               src:['**/*.js','!t.js'],1)">             }] 
        }
    }

如果需要详细了解用grunt搭建web前端开发环境，地址：http://www.cnblogs.com/moqiutao/p/5316336.html

原文链接：/webpack/994542.html

用grunt进行ES6转换，再用uglify压缩所有js实例 ：http://www.cnblogs.com/moqiutao/p/5316336.html