grunt對象之api

時間 2019-11-15

標籤 grunt 對象 api 欄目 Node.js 简体版

原文原文鏈接

　　grunt已經扯了七篇了，殊爲不易。最後一篇扯點早應該說起的東西，就是module.exports = function(grunt) {}傳入的這個grunt。以前的代碼grunt通常只出如今Gruntfile.js這幾個地方。css

require('load-grunt-tasks')(grunt);
require('time-grunt')(grunt);
grunt.initConfig({
    ...
});
grunt.registerTask('default', [...]);

　　但grunt的內容遠遠不止這些，它包含9個對象屬性，而上面的initConfig、registerTask不過是某些屬性對象的方法，是爲了方便用戶調用所取的別名而已。html

　　9個對象將分別進行介紹。node

config
grunt.config.init(obj): grunt.initConfig()的元神，沒必要多說了吧。
grunt.config(prop[, value]): 能夠叫語法糖麼，當參數爲一個的時候調用grunt.config.get()。當參數爲兩個的時候調用grunt.config.set()。
grunt.config.get/set(prop[, value]): 設置或者獲取prop
grunt.config.getRaw(prop): 獲取prop的原始code
grunt.config.process(templateString): 返回<%=var.prop%>這種模板對應的值。通常來講，設置的prop當value爲string時（好比src，dest）能夠直接使用模板，可是當value爲function時，想要經過模板獲取字符串就須要用到這個方法了。
舉個栗子，本身感覺吧。

'use strict';

module.exports = function(grunt) {
    
    require('load-grunt-tasks')(grunt);
    require('time-grunt')(grunt);
    
    var path = {
        src: 'src',
        dest: 'dest'
    }
    
    grunt.config.init({
        path: path,
        copy: {
            test: {
                files: [
                    {
                        expand: true,
                        cwd: '<%=path.src%>/',
                        src: '{,*/}*',
                        dest: '<%=path.dest%>'
                    }
                ]
            }
        }
    });
    
    grunt.config('clean', {
        test: '<%=path.dest%>'
    });
    
    console.log(grunt.config('path').dest);                     //output: dest
    console.log(grunt.config.process('<%=path.dest%>'));        //output: dest
    console.log(grunt.config.get('clean').test);                //output: dest
    console.log(grunt.config.getRaw('clean').test);             //output: <%=path.dest%>
    
    grunt.registerTask('default', ['clean', 'copy']);
}

event
grunt.event.on(type, listener): 設置某類型事件的監聽函數
grunt.event.once(type, listener): 設置某類型事件的一次性監聽函數
grunt.event.many(type, count, listener): 設置某類型事件的屢次性監聽函數
grunt.event.off(type, listener): 取消某類型事件的某個監聽函數
grunt.event.removeAllListeners([type]): 取消某類型事件的所有監聽函數
grunt.event.emit(type[, arg1[, arg2...]]): 發出某類型時間
須要注意的是，grunt中沒有原生的event type，所有本身定義本身發出。
這部分方法比較簡單，和jQuery的命名很類似，因此直接給出代碼和輸出過了吧。

'use strict';

module.exports = function(grunt) {

    function foron(count) {
        console.log('test for off ' + count);
    }
    
    grunt.event.on('test', foron);
    grunt.event.on('test', function(count) {
        console.log('test for on ' + count);
    });
    
    grunt.event.once('test', function(count) {
        console.log('test for once ' + count);
    });
    
    grunt.event.many('test', 2, function(count) {
        console.log('test for many ' + count);
    });
    
    grunt.event.emit('test', 1);
    grunt.event.emit('test', 2);
    grunt.event.emit('test', 3);
    grunt.event.off('test', foron);
    grunt.event.emit('test', 4);
    grunt.event.removeAllListeners();
    grunt.event.emit('test', 5);
    
    grunt.registerTask('default', []);
}

輸出以下：json

test for off 1
test for on 1
test for once 1
test for many 1
test for off 2
test for on 2
test for many 2
test for off 3
test for on 3
test for on 4

fail
grunt.fail.warn(msg[, errorcode]): grunt.warn()的本尊，顯示一條警告信息而後退出grunt的本次執行，執行grunt時使用--force參數無視警告信息繼續執行
grunt.fail.fatal(msg[, errorcode]): grunt.fatal()的本尊，顯示一條錯誤信息而後退出grunt的本次執行
Gruntfile.js中通常是用不到的，若是你編寫plugin就確定用的到了。
file 文件操做，封裝了nodejs中的fs模塊
grunt.file.defaultEncoding: 文件編碼，默認是'utf8'
grunt.file.preserveBOM: 是否在檔首保留BOM，默認false

grunt.file.read(filepath[, options]): 讀取並返回文件內容，options.encoding爲null時返回Buffer，其餘返回String
grunt.file.readJSON(filepath[, options]): 讀取並返回文件內容的JSON對象表示，常見var pack = grunt.file.readJSON('package.json');
grunt.file.readYAML(filepath[, options]): 同上，我表示不懂YAML
grunt.file.write(filepath, contents[, options]): 將contents寫入filepath，contents能夠是String或Buffer

grunt.file.copy(srcpath, destpath[, options]): 拷貝文件，會自動建立文件夾
grunt.file.delete(filepath[, options]): 刪除文件

grunt.file.mkdir(dirpath[, options]): 建立文件夾
grunt.file.recurse(rootdir, callback): 遍歷文件夾下的全部文件（包括子文件夾下的），並執行callback(abspath, rootdir, subdir, filename)

grunt.file.expand([options, ]patterns): 返回patterns匹配的全部路徑，好比我以前的項目結構grunt.file.expand('src/**')返回的以下
```
[ 'src',
  'src/css',
  'src/css/base.css',
  'src/css/main.css',
  'src/image',
  'src/image/haiys02.jpg',
  'src/index.html',
  'src/js',
  'src/js/hellogrunt.js',
  'src/js/helloworld.js' ]
```
grunt.file.expandMapping(patterns, dest[, options]): 返回patterns匹配路徑和原路徑的鍵值對，好比grunt.file.expandMapping('**', 'dest', {cwd: 'src'})返回
api
```
[ { src: [ 'src' ], dest: 'dest' },
  { src: [ 'src/css' ], dest: 'dest/css' },
  { src: [ 'src/css/base.css' ], dest: 'dest/css/base.css' },
  { src: [ 'src/css/main.css' ], dest: 'dest/css/main.css' },
  { src: [ 'src/image' ], dest: 'dest/image' },
  { src: [ 'src/image/haiys02.jpg' ],
    dest: 'dest/image/haiys02.jpg' },
  { src: [ 'src/index.html' ], dest: 'dest/index.html' },
  { src: [ 'src/js' ], dest: 'dest/js' },
  { src: [ 'src/js/hellogrunt.js' ],
    dest: 'dest/js/hellogrunt.js' },
  { src: [ 'src/js/helloworld.js' ],
    dest: 'dest/js/helloworld.js' } ]
```
grunt.file.match([options, ]patterns, filepaths): 返回filepaths中匹配patterns的路徑
grunt.file.isMatch([options, ]patterns, filepaths): filepaths中一旦有path命中即返回true

grunt.file.exists(path1[, path2...]): 返回paths是否存在
grunt.file.isLink/Dir/File(path1[, path2...]): 返回paths是否爲連接、文件夾、文件

grunt.file.isPathAbsolute(path1[, path2...]): 返回paths是否爲絕對路徑
grunt.file.arePathsEquivalent(path1[, path2...]): 返回paths是否相同
grunt.file.doesPathContain(dir, path1[, path2...]): 返回paths是否在dir中
grunt.file.isPathCwd(path1[, path2...]): 返回paths是否爲cwd
grunt.file.isPathInCwd(path1[, path2...]): 返回paths是否在cwd中，cwd不在cwd中
grunt.file.setBase(path1[, path2...]): 設置當前的cwd數組
log/verbose
grunt.log.write[ln](msg): 打印 msg
grunt.log.error[lns](msg): 打印紅色'>>' msg
grunt.log.ok[lns](msg): 打印綠色'>>' msg
grunt.log.subhead(msg): 打印高亮msg
grunt.log.writeflags(obj, prefix): 打印 prefix: obj.toString()
grunt.log.debug(msg): 當指定--debug時打印 [D] msg
option
grunt.option(key[, value]): 讀取或設置option grunt --key1=value1 --key2=value2
grunt.option.init([obj]): 初始化option對象
grunt.option.flags(): 將option對象以'key=value'字符串數組方式返回

task
grunt.task.registerTask(taskname, taskslist)/(taskname, desc, taskFunction): grunt.registerTask的真身，註冊可執行的任務
grunt.task.registerMultiTask(taskname, desc, taskFunction): grunt.registerMultiTask的真身，註冊新的task類型，需指定target才能執行，function內部經過this.target獲取當前target，經過this.data獲取當前target的value

'use strict';

module.exports = function(grunt) {
    
    require('time-grunt')(grunt);
    
    grunt.initConfig({
      log: {
        foo: [1, 2, 3],
        bar: 'hello world',
        baz: {
            options: {
                bool: false
            }
        }
      }
    });

    grunt.task.registerMultiTask('log', 'Log stuff.', function() {
      grunt.log.writeln(this.target + ': ' + this.data);
    });
    
    grunt.registerTask('default', ['log']);
}

輸出以下：app

Running "log:foo" (log) task
foo: 1,2,3

Running "log:bar" (log) task
bar: hello world

Running "log:baz" (log) task
baz: [object Object]

grunt.task.renameTask: 重命名task type，原task type將不可以使用
grunt.task.loadTasks: grunt.loadTasks的真身，指定須要加載的文件的目錄
grunt.task.loadNpmTasks: grunt.loadNpmTasks的真身，指定須要加載的plugin
如下語句效果相同異步

grunt.loadTasks('node_modules/grunt-contrib-clean/tasks/');
grunt.loadNpmTasks('grunt-contrib-clean');

grunt.task.run(tasksList): 執行任務隊列
grunt.task.clearQueue(): 清空任務隊列
grunt.task.normalizeMultiTaskFiles(): 將target將要處理的文件以src-dest-orig對象數組的形式序列化，以config中Gruntfile.js爲例，添加代碼函數

console.log(grunt.task.normalizeMultiTaskFiles(grunt.config.process('<%=copy.test%>')));

打印出的內容以下：grunt

[ { src: [ 'src/css' ],
    dest: 'dest/css',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/css/base.css' ],
    dest: 'dest/css/base.css',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/css/main.css' ],
    dest: 'dest/css/main.css',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/image' ],
    dest: 'dest/image',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/image/haiys02.jpg' ],
    dest: 'dest/image/haiys02.jpg',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/index.html' ],
    dest: 'dest/index.html',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/js' ],
    dest: 'dest/js',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/js/hellogrunt.js' ],
    dest: 'dest/js/hellogrunt.js',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } },
  { src: [ 'src/js/helloworld.js' ],
    dest: 'dest/js/helloworld.js',
    orig: { expand: true, cwd: 'src/', src: [Object], dest: 'dest' } } ]

template
grunt.template.process(templateString, options): 處理模板字符串，與grunt.config.process類似但不一樣，返回string，options中的data屬性存放context
grunt.template.date(date, format): 格式化日期，format 'yyyy-mm-dd HH:MM:ss'
grunt.template.today(format): 格式化今天的日期
util
grunt.util.kindOf(value): 返回值的類型，比typeof詳細
grunt.util.error(msg[, origError]): 返回一個錯誤
grunt.util.linefeed: 當前系統的換行符
grunt.util.normalizelf(string): 將string中的換行符替換成當前系統的換行符
grunt.util.recurse(array/object, callback, continueFunction): 遞歸傳入array/object的值，若是continueFunction返回false，則返回原值，continueFunction返回true，則返回callback的值。
```
var arr = [1, 2, 3],
        result = grunt.util.recurse(arr, function(value) {
            console.log('value ' + value);
            return value * value;
        }, function(value) {
            if(value % 2 === 0)
                return false;
        });
    console.log('result ' + result);
```
輸出：
```
value 1
value 3
result 1,2,9
```
grunt.util.repeat(n, str): 返回重複n次str的值
grunt.util.pluralize(n, str, separator): 以separator分隔str並返回第n個元素
grunt.util.spawn(options, doneFunction): 建立子進程執行任務，子進程退出時調用doneFunction
options{cmd: command, grunt: false, args: arguments, opts: options, fallback: value}
grunt.util.toArray(obj): 轉換爲數組
grunt.util.callbackify: 將一個同步函數轉換爲異步函數，即將帶返回值的函數轉換爲一個傳入回調函數的函數
```
function add1(a, b) {
    return a + b;
}
function add2(a, b, callback) {
    callback(a + b);
}

var fn1 = grunt.util.callbackify(add1);
var fn2 = grunt.util.callbackify(add2);

var result1 = fn1(1, 2, function(result) {
    console.log('1 plus 2 equals ' + result);
});
var result2 = fn2(1, 2, function(result) {
    console.log('1 plus 2 equals ' + result);
});

console.log(result1);
console.log(result2);
```
輸出：
```
1 plus 2 equals 3
1 plus 2 equals 3
undefined
undefined
```

　　好了，這大致就是整個grunt的api介紹了，如今寫一個比較完善和優美的Gruntfile.js應該不是什麼問題了吧。　　之後有機會可能會補充些編寫grunt plugin的內容，如今就告一段落了。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。