Grunt 合并压缩js文件

http://www.cnblogs.com/yexiaochai/p/3594561.html

http://www.cnblogs.com/yexiaochai/p/3602002.html

http://www.cnblogs.com/snandy/archive/2013/03/07/2946989.html

http://www.cnblogs.com/snandy/archive/2013/03/11/2949177.html

http://www.cnblogs.com/snandy/archive/2013/05/20/3088613.html

 

 

 

一。安装node.js

 

运行：node-v0.12.2-x86.msi  系统自动化将环境变量设置好

 

 

二。安装grunt

 

c:\app 下：

 

dos命令进入 app下：

npm install -g grunt-cli

 

（这条命令将会把grunt命令植入系统路径，这样就能在任意目录运行他，原因是每次运行grunt时，它都会使用node的require查找本地是否安装grunt，如果找到CLI便加载这个本地grunt库

然后应用我们项目中的GruntFile配置，并执行任务PS：这段先不要管，安装完了往下看）

 

三。打包zepto：

 

1.创建：package.json

 

{

  "name": "demo",

  "file": "zepto",

  "version": "0.1.0",

  "description": "demo",

  "license": "MIT",

  "devDependencies": {

    "grunt": "~0.4.1",

    "grunt-contrib-jshint": "~0.6.3",

    "grunt-contrib-uglify": "~0.2.1",

    "grunt-contrib-requirejs": "~0.4.1",

    "grunt-contrib-copy": "~0.4.1",

    "grunt-contrib-clean": "~0.5.0",

    "grunt-strip": "~0.2.1"

  },

  "dependencies": {

    "express": "3.x"

  }

}

2.  创建：Gruntfile.js

 

3.  npm install

 

3.  新建 src 目录，写一个 zepto.js 文件（空文件）

 

4.  然后在Gruntfile中新增以下代码：

module.exports = function (grunt) {

  // 项目配置

  grunt.initConfig({

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

    uglify: {

      options: {

        banner: '/*! <%= pkg.file %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'

      },

      build: {

        src: 'src/<%=pkg.file %>.js',

        dest: 'dest/<%= pkg.file %>.min.js'

      }

    }

  });

  // 加载提供"uglify"任务的插件

  grunt.loadNpmTasks('grunt-contrib-uglify');

  // 默认任务

  grunt.registerTask('default', ['uglify']);

}

 

5. dos 进入src 目录：  grunt 命令

 

6.  dest 目录生成一个 zepto.min.js 文件

 

 

三。多个js文件合并和压缩：

src 目录下添加：src/zepto.js', 'src/underscore.js', 'src/backbone.js' 这3个js文件

 

如果是合并并压缩：

 

module.exports = function (grunt) {

  // 项目配置

  grunt.initConfig({

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

    concat: {

      options: {

        separator: ';'

      },

      dist: {

        src: ['src/zepto.js', 'src/underscore.js', 'src/backbone.js'],

        dest: 'dest/libs.js'

      }

    },

    uglify: {

      build: {

        src: 'dest/libs.js',

        dest: 'dest/libs.min.js'

      }

    }

  });

  grunt.loadNpmTasks('grunt-contrib-uglify');

  grunt.loadNpmTasks('grunt-contrib-concat');

  // 默认任务

  grunt.registerTask('default', ['concat', 'uglify']);

}

 

 

（出现问题：

Local Npm module "grunt-contrib-concat" not found. Is it installed? 

npm install grunt-contrib-concat）