- 安装准备
1. Grunt 以及 Grunt 的插件都是通过 npm 安装的(确保npm是最新版本 npm update -g npm )。
在安装之前需要先将Grunt命令行(CLI)安装到全局环境中, npm install -g grunt-cli grunt-cli 的职能是调用与 Gruntfile 所在目录中的Grunt。
在需要构建的项目中配置一份 package.json 和 Gruntfile 文件 配置内容后续内容会阐述。
2. 运行终端将命令行迁到项目的根目录。执行 npm install 命令安装项目依赖的库。执行 grunt 命令。
3. package.json 应该放置于项目的根目录中,在这个文件中列出项目依赖的 grunt 和 grunt插件 放在 devDependencies 配置段内。
创建package.json文件的方式有多种
*npm init 命令或创建一个基本的package.json 文件。
*自己写案例,根据需要扩充,提供一个范例:

- 安装 Grunt 以及 Grunt 插件
1.向已经有 package.json 文件中添加 Grunt 和 Grunt插件 最简单的方式是: npm install <module> --save-dev 命令。此命令安装了<module>,还会自动将其添加到 devDependencies 。
例如安装 Grunt 最新版本到项目目录中, npm install grunt --save-dev
例如安装 Grunt 插件也可以以同样的方式安装, npm install grunt-contrib-concat--save-dev
插件的安装可根据自身项目需求选择安装。
2. Gruntfile 文件
Gruntfile.js文件放在项目的根目录中 和 package.json 文件在同一目录层级 。
Gruntfile.js 由四部分组成,分别是: "wrapper"函数 , 项目与任务配置 , 加载 grunt插件和任务 ,自定义任务。
提供一个自己写的 Gruntfile.js 案例,再分布阐述 各部分的作用。

* "wrapper"函数 :所有的 grunt 代码必须放在次函数内:
* 项目和任务配置: 首先通过 grunt.file.readJSON('package.json') 将存储在package.json文件中的JSON元数据引入到grunt config中。
在这个配置对象中存储任意的数据。 在 task (任务)中例如:grunt-contrib-uglify 插件中的uglify 任务要求它的配置被指定在一个同名属性中。
* 加载 Grunt 插件和任务 要在 package.json 文件中列为 dependency (依赖) 的包,并通过npm install安装之后,
都可以在Gruntfile中以简单命令的形式使用。
* 自定义任务:通过定义 default 任务,可以让Grunt默认执行一个或多个任务,注意先后顺序!grunt.registerTask('default', ['concat','uglify']);
以上是 Grunt 安装 配置 使用 的内容小结,以后有扩展会继续补充~
来源:https://www.cnblogs.com/mayasiyu/p/5850351.html