grunt系列启动grunt项目

 

    启动grunt project：

 

    1、已经存在的grunt project

 

     假设grunt CLI已经安装了，项目里面已经有package.json和Gruntfile，启动很简单：

 

• 到项目的根目录
• 安装项目依赖：

npm install

 

• 启动grunt

grunt

 

 

    2、一个新的grunt project

 

    增加两个文件到你的项目里面：

 

• package.json

      你会在这个文件里面列出项目需要的grunt和grunt plugins：

 

{
    "name" : "***",
    "version" : "*.*.*",
    "devDependencies" : {
            "grunt" : "~0.4.0",
            "grunt-contrib-jshint" : "~0.1.1",
            "grunt-contrib-uglify" : "~0.1.2",
            "grunt-contrib-concat" : "~0.1.1"
    }
}

 

     package.json文件放在项目的根目录下，和Gruntfile同级

 

     在根目录下执行：npm install，package.json里面定义的依赖版本会正确的加载！

 

     在你的项目里面有几种方式去创建package.json

 

//大部分的grunt-init templates会自动的创建一个项目特有的package.json文件

//会创建一个基本的package.json文件
npm init 

可以以下面例子开始，如果需要的话可以扩展

{
    "name" : "my-project-name",
    "version" : "0.1.0",
    "devDependencies" : {
         "grunt" : "~0.4.1",
         "grunt-contrib-jshint" : "~0.1.1",
         "grunt-contrib-nodeunit" : "~0.1.2"
    }
}

  

 

• Gruntfile

     这个文件命名成：Gruntfile.js 或者 Gruntfile.coffee

 

     它是用来配置和定义任务的，同时加载grunt plugins

 

      注释： 在0.3.x version的时候，它叫做：grunt.js

 

 

     一个gruntfile由以下部分组成：

 

• "wrapper" function

module.exports = function(grunt){
    //在这里面加入相关的任务代码
}

 

 

• 项目和任务配置
• 加载grunt plugins和任务
• 自定义任务

   注：参数grunt 

 

module.exports = function(grunt){
    
      grunt.initConfig({
           pkg: grunt.file.readJSON('package.json'),
           uglify: {
                options: {
                     banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n',
                },
                build: {
                    src: 'src/<%= pkg.name %>.js',
                    dest: 'build/<%= pkg.name %>.min.js'
               }
           } 
      });

      //加载支持uglify任务的插件
      grunt.loadNpmTasks('grunt-contrib-uglify');

      //默认的任务
      grunt.registerTask('default',['uglify']);
 
};