本节咱们开始学习如何创立 Gulp
工作。每一个 Gulp
工作都是一个异步的 JavaScript 函数,这个函数是一个能够接管回调函数 callback
作为参数的函数,或者是一个返回 stream
、promise
、event emitter
、child process
或 observable
类型值的函数。
gulp.task()办法
gulp.task()
用于创立一个 gulp
工作,语法如下所示:
gulp.task(name[, deps], fn)
name
:示意工作的名称。deps
:以后定义的工作须要依赖的其余工作,为一个数组。以后定义的工作会在所有依赖的工作执行结束后才开始执行。如果没有依赖,则省略这个参数。fn
:为工作函数,咱们把工作要执行的代码都写在外面。是一个可选参数。
给工作起一个惟一的名称后,咱们能够通过这个名称来执行工作,例如:
> gulp 工作名
在执行工作时,如果咱们不加工作名进行执行,也就是只输出 gulp
命令时,会执行名为 default
的默认工作,如果没有定义这个工作,将什么也不做。
创立 gulpfile 文件
首先咱们须要在我的项目根目录下创立一个 gulpfile.js
文件。并在文件中引入 gulp
:
var gulp = require('gulp');
用于通知 Node 去 node_modules
中查找 gulp
包,先在部分进行查找,找不到则去全局环境中查找。找到之后就会赋值给 gulp
变量,而后咱们就能够应用它了。
示例:
例如创立一个名为 xkd
的工作:
let gulp = require('gulp');
gulp.task('xkd', done => {console.log("你好,侠课岛!")
done()});
执行 gulp xkd
命令,下图为运行后果:
- 运行后果第一行示意找到本地的
gulpfile.js
文件。 - 运行后果第二行示意开始运行工作
xkd
,这个xkd
是咱们给工作定义的名称。 - 运行后果第三行示意运行代码内的逻辑。
- 运行后果第四行示意工作
'xkd'
运行完结,一共耗时5.27 ms
执行多个工作
gulp.task()
办法中的第二个参数为一个数组,数组中的值是工作名的汇合,当执行此工作时,会先执行数组中的工作。咱们来看一下例子。
示例:
上面咱们定义三个工作:
const gulp = require('gulp');
gulp.task('one', done1 => {console.log("第一个工作");
done1();})
gulp.task('two', done2 => {console.log("第二个工作");
done2();})
gulp.task('test', gulp.series('one', 'two', done3 =>{console.log("测试工作")
done3()}))
而后将工作 one
、two
增加到工作 test
中,此时如果咱们输出 gulp test
命令,会先执行数组中的工作,咱们来看一下工作的执行程序:
链接:https://www.9xkd.com/