GRUNT: The JavaScript Task Runner
JavaScript 任務(wù)執(zhí)行器，類似于 Java 中的 Ant 和 Maven。
Grunt 的生態(tài)系統(tǒng)很大，包括很多的插件。
為什么需要 Task Runner
簡(jiǎn)而言之：自動(dòng)化。
在執(zhí)行一些重復(fù)性的工作時(shí)，例如代碼壓縮，編譯，單元測(cè)試，代碼質(zhì)量檢測(cè)等等，Task Runner 使得用戶的操作更簡(jiǎn)單。
通過配置 Gruntfile 文件，Task Runner 可以自動(dòng)執(zhí)行相關(guān)的任務(wù)。
Grunt 的使用
Grunt 的安裝
通過 Node 來安裝 Grunt。
在 package.json 文件的 devDependencies 屬性中配置 Grunt 及相應(yīng)插件的版本。隨后執(zhí)行命令 npm install
package.json 文件
package.json 文件的規(guī)范參考 https://docs.npmjs.com/files/package.json
package.json 文件位于項(xiàng)目的根目錄，與 Gruntfile.js 文件并列。
執(zhí)行 npm install 命令來安裝對(duì)應(yīng)版本的 Grunt 及相應(yīng)插件。
package.json 文件示例如下：
{
"name": "my-project-name",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.5",
"grunt-contrib-jshint": "~0.10.0",
"grunt-contrib-nodeunit": "~0.4.1",
"grunt-contrib-uglify": "~0.5.0"
}
}
Gruntfile.js 文件
Gruntfile.js 文件包含4個(gè)部分：
-
The "wrapper" function
如下：
module.exports = function(grunt) {
// Do grunt-related things in here
};
- Project and task configuration 任務(wù)的配置
- Loading Grunt plugins and tasks
-
Custom tasks 自定義任務(wù)
如下：
grunt.registerTask('unittest', [
'clean:build',
'mkdir:build',
'copy:build',
'karma:unit'
]);
一個(gè)完整的示例如下：
module.exports = function(grunt) {
// Project configuration.
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'
}
}
});
// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-uglify');
// Default task(s).
grunt.registerTask('default', ['uglify']);
};
關(guān)于任務(wù)的創(chuàng)建，可以參考 Creating tasks
引用：
Grunt 官網(wǎng)
