使用GruntJS构建Web程序之Tasks(任务)篇

 更新时间:2014年06月06日 11:10:43   作者:  
任务(Tasks)是grunt的核心概念,你所做的很多工作比如资源合并(concat)、压缩(uglify)都是在配置任务。 每次grunt运行的时候,你指定的一个或多个任务也在运行,如果你没有指定任务,那么一个默认名为“default”的任务将自动运行。

如何自定义Grunt任务

有时我们需要写一些自己的grunt任务,下面是一个具体例子

一、准备

1. 新建一个目录g1
2. 新建package.json,放入g1
3. 新建Gruntfile.js,放入g1

package.json

复制代码 代码如下:
 
{
    "name": "g1",
    "version": "0.1.0",
    "author": "@snandy",
    "homepage": "http://www.g1.com",
    "devDependencies": {
        "grunt": "~0.4.0"
    }
}

4. cd进入g1,npm install安装grunt包

这整个目录结构如下

Gruntfile.js暂时空着。

二、创建一个最简单的任务

grunt.registerTask(taskName, [description,] taskFunction)

taskName 任务名称,命令行里使用 grunt + taskName
description 任务的描述
taskFunction 任务的实现

Gruntfile.js里填入一下代码

复制代码 代码如下:
 
module.exports = function(grunt) {
    grunt.registerTask('mytask', '一个最简单的任务演示,根据参数打印不同的输出.', function(arg1, arg2) {
        if (arguments.length === 0) {
            grunt.log.writeln('任务' + this.name + ", 没有传参数");
        } else if (arguments.length === 1) {
            grunt.log.writeln('任务' + this.name + ", 有一个参数是" + arg1);
        } else {
            grunt.log.writeln('任务' + this.name + ", 有两个参数分别是" + arg1 + ", " + arg2);
        }
    });
};

注册了一个任务“mytask”,实现一个最简单的根据所传参数不同实现不同的打印输出,看运行结果我们需要进入命令行。

进入到g1目录,输入 grunt mytask

再输入 grunt mytask:snandy


任务名后面加一个冒号就可以传参了

再输入 grunt mytask:snandy:backus


冒号间隔可以传多个参数

三、一次创建多个任务

grunt.registerMultiTask(taskName, [description,] taskFunction)

可以看到参数是一样的,方法名不同。但使用方式却不太同,需要先初始化config,Gruntfile.js如下

复制代码 代码如下:
 
module.exports = function(grunt) {
    grunt.initConfig({
        log: {
            t1: [1, 2, 3],
            t2: 'hello world',
            t3: false
        }
    });

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

进入g1目录,分别测试下

输入 grunt,会依次执行三个子任务t1,t2,t3

分别输入 grunt log:t1, grunt log:t2, grunt log:t3


四、任务间通讯

在一个任务内部可以调用另外一个任务,如下

复制代码 代码如下:
 
module.exports = function(grunt) {

    grunt.registerTask('mytask', '一个最简单的任务演示,根据参数打印不同的输出.', function(arg1, arg2) {
        if (arguments.length === 0) {
            grunt.log.writeln('任务' + this.name + ", 没有传参数");
        } else if (arguments.length === 1) {
            grunt.log.writeln('任务' + this.name + ", 有一个参数是" + arg1);
        } else {
            grunt.log.writeln('任务' + this.name + ", 有两个参数分别是" + arg1 + ", " + arg2);
        }
    });

    grunt.registerTask('default', '默认的任务', function() {
        // 调用mytask
        grunt.task.run('mytask:param1:param2')
    })
};

进入命令行,输入grunt

调用多个任务,以逗号分隔传给run方法即可,或者以数组形式

复制代码 代码如下:

grunt.registerTask('default', '默认的任务', function() {
    grunt.task.run('mytask1', 'mytask2')
    // 或者
    grunt.task.run(['mytask1', 'mytask2'])  
})

相关文章

  • Nodejs高扩展性的模板引擎 functmpl简介

    Nodejs高扩展性的模板引擎 functmpl简介

    本文给大家分享的是一款nodejs高扩展性的模板引擎functmpl的简单介绍以及用法详解,有需要的小伙伴可以参考下
    2017-02-02
  • Node.js中利用js-xlsx处理xlsx文件的实现

    Node.js中利用js-xlsx处理xlsx文件的实现

    js-xlsx库是目前Github上star数量最多的处理Excel的库,本文介绍用 Node.js中的js-xls库来处理Excel文件,具有一定的参考价值,感兴趣的可以了解一下
    2023-10-10
  • 一文学会搭建HTTP服务器调用DLL库

    一文学会搭建HTTP服务器调用DLL库

    这篇文章主要为大家介绍了一文学会搭建HTTP服务器调用DLL库,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-06-06
  • 利用pm2部署多个node.js项目的配置教程

    利用pm2部署多个node.js项目的配置教程

    目前似乎最常见的线上部署nodejs项目的有forever,pm2这两种,而下面这篇文章主要给大家介绍了关于利用pm2部署多个node.js项目的配置教程,文中通过示例代码介绍的非常详细,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-10-10
  • node-gyp安装vuetify编译失败gyp ERR的问题及解决

    node-gyp安装vuetify编译失败gyp ERR的问题及解决

    这篇文章主要介绍了node-gyp安装vuetify编译失败gyp ERR的问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-03-03
  • node微信开发之获取access_token+自定义菜单

    node微信开发之获取access_token+自定义菜单

    这篇文章主要介绍了node微信开发之获取access_token+自定义菜单,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-03-03
  • Node.js静态服务器的实现方法

    Node.js静态服务器的实现方法

    这篇文章主要介绍了Node.js静态服务器的实现方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2018-02-02
  • ajax +NodeJS 实现图片上传实例

    ajax +NodeJS 实现图片上传实例

    本篇文章主要介绍了ajax +NodeJS 实现图片上传实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • node.js中的path.resolve方法使用说明

    node.js中的path.resolve方法使用说明

    这篇文章主要介绍了node.js中的path.resolve方法使用说明,本文介绍了path.resolve的方法说明、接收参数、语法、使用实例和实现源码,需要的朋友可以参考下
    2014-12-12
  • websocket结合node.js实现双向通信的示例代码

    websocket结合node.js实现双向通信的示例代码

    本文主要介绍了websocket结合node.js实现双向通信的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-02-02

最新评论