Grunt使用心得

1.安装npm

2.安装CLI ( npm install -g grunt-cli)

3.安装grunt (npm install grunt --save-dev)

4.添加gruntfile.js

module.exports = function (grunt) {

  grunt.initConfig({

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

    concat: {

      options: {

        separator: ';'

      },

      dist: {

        src: ['src/**/*.js'],

        dest: 'dist/<%= pkg.name %>.js'

      }

    },

    uglify: {

      options: {

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

      },

      dist: {

        files: {

          'dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']

        }

      }

    },

    qunit: {

      files: ['test/**/*.html']

    },

    jshint: {

      files: ['gruntfile.js', 'src/**/*.js', 'test/**/*.js'],

      options: {

        //这里是覆盖JSHint默认配置的选项

        globals: {

          jQuery: true,

          console: true,

          module: true,

          document: true

        }

      }

    },

    watch: {

      files: ['<%= jshint.files %>'],

      tasks: ['jshint', 'qunit']

    }

  });



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

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

  //grunt.loadNpmTasks('grunt-contrib-qunit');

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

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



  grunt.registerTask('test', ['jshint', 'qunit']);

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

};

5.添加package.json

{

    "name":"test", 

    "version":"0.1.0",

    "devDependencies": { 

        "grunt":"~0.4.1", 

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

        "grunt-contrib-nodeunit":"~0.2.0",

        "grunt-contrib-uglify":"~0.2.2"

    }

}

6.安装 package.json里面依赖的插件

逐个安装

 npm install grunt-contrib-htmlmin --save-dev

......

7.运行grunt 命令