grunt js

1.安装node js: http://nodejs.org/

2. 安装grunt全局命令：

命令行工具输入： npm install -g grunt-cli

3. 在项目所在的根目录下创建package.json文件：

（1）package.json中内容类似：

（2）命令行工具将目录调到项目根目录

（3）命令行工具中 输入： npm install <module> --save-dev   进行安装。（目前用grunt ~0.4.1）

  <module>： grunt, grunt-contrib-jshint, grunt-contrib-concat......

（4）安装完grunt及所需插件后在项目根目录下创建一个Gruntfile.js

module.exports = function(grunt) {
 
    // Project configuration.
    grunt.initConfig({
 
        //Read the package.json (optional)
        pkg: grunt.file.readJSON('package.json'),
 
        // Metadata.
        meta: {
            basePath: '',
            srcPath: 'js/',
            deployPath: 'js/'
        },
 
        banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +
                '<%= grunt.template.today("yyyy-mm-dd") %>\n' +
                '* Copyright (c) <%= grunt.template.today("yyyy") %> ',
            
        // 合并js
        concat: {
            options: {
                stripBanners: true,
                separator: ";"
            },
            dist: {
                src: ['js/base.js', 'js/main.js'],
                dest: 'js/main.js'
            }
        },

        //压缩js
        uglify: {
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n',
                separator: ";"
            },
            files: {
                src: ['js/main.js'],
                dest: 'js/',
                expand: true,
                flatten: true,
                ext: ".min.js"
            }
        },

        //压缩css
        cssmin: {
            options: {
                keepSpecialComments: 0 /* 移除 CSS 文件中的所有注释 */
            },
            minify: {
                expand: true,
                cwd: 'css/',
                src: ['style.css', 'friend.css'],
                dest: 'css/',
                ext: '.min.css'
            }
        }

    });
 
    //合并
    grunt.loadNpmTasks('grunt-contrib-concat');
    // grunt.registerTask('default', ['concat']);

    //压缩
    grunt.loadNpmTasks('grunt-contrib-uglify');
    // grunt.registerTask('default', ['uglify']);

    //css
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.registerTask('default', ['concat', 'uglify', 'cssmin']);
};

4. 命令行工具中输入：grunt就可以运行 Gruntfile.js中的命令了