gulp入门(2)
来源:互联网 发布:数据库编辑器 编辑:程序博客网 时间:2024/05/22 13:39
定义一个任务
格式
gulp.task("<taskname>"[, deps], fn);
taskname: 任务名称,必须,这是一个任务的标识,不能与其它任务名称重名,任务名不能有空格
deps: 当前任务依赖的任务,被依赖的任务将先于当前任务被执行
fn: 任务执行函数,当前任务的操作主体都写在这个函数里
例1:一次性依赖多个任务
任务ex1依赖任务ex1_one、ex1_two
任务执行流程为 ex1_one -> ex1_two -> ex1
var gulp = require('gulp');gulp.task('ex1_one', [], function() { console.log('start task one');});gulp.task('ex1_two', [], function() { console.log('start task two');});gulp.task('ex1', ['ex1_one', 'ex1_two'], function() { console.log('start example');});
运行后输出:
start task onestart task twostart example
例2:重复依赖同一个任务
任务ex2依赖任务ex2_one、ex2_two
任务ex2_one依赖任务ex2_two
ex2_two被ex2及ex2_one同时依赖,但ex2_two只会被执行一次,并不会多次执行,
ex2_two的执行顺序会根据依赖的关系进行调整
任务执行流程为 ex2_two -> ex2_one -> ex1
var gulp = require('gulp');gulp.task('ex2_one', ['ex2_two'], function() { console.log('start task one');});gulp.task('ex2_two', [], function() { console.log('start task two');});gulp.task('ex2', ['ex2_one', 'ex2_two'], function() { console.log('start example');});
运行后输出
start task twostart task onestart example
例3:异步任务
通过前两个例子,可以看到,gulp 会根据依赖列表中的顺序先后依次执行,但这里所谓的先后只是开始执行的顺序。
事实上,gulp 执行任务时总是以最大的并发数执行,也就是说,gulp 会一次性运行所有的任务,并且不做任何等待。
在上面两个例子中,看到的先后执行顺序,是因为每一个任务内容太少,瞬间执行完成,所以看上去跟同步执行一样,通过下面的例子,即可看出差异。
将 [例1] 进行改装,在任务one中添加一个异步操作,然后再观察输出。
ex3 才及 ex3_two 并没有等待 ex3_one 执行完成后才开始执行,而是马上执行。
gulp.task('ex3_one', [], function() { setTimeout(function() { console.log('start task one delay 2s'); }, 1);});gulp.task('ex3_two', [], function() { console.log('start task two');});gulp.task('ex3', ['ex3_one', 'ex3_two'], function() { console.log('start example');});
运行后输出
start task twostart examplestart task one delay 2s
例4:任务同步
如果一个任务是在另外一个任务彻底完成之后再开始执行,也就是同步执行,gulp 中有三种方法可以实现
- 1、使用回调函数
gulp.task('ex4_three', [], function(cb) { setTimeout(function() { console.log('start task three delay 2s'); cb(); }, 2);});
- 2、使用promise(需要安装 q 插件,怎么安装?查看上一章)
var Q = require('q');gulp.task('ex4_four', [], function() { var deferred = Q.defer(); setTimeout(function() { console.log('start task four delay 1s'); return deferred.resolve(); }, 1); return deferred.promise;});
- 3、返回一个stream
gulp.task('ex4_five', [], function() { var src = gulp.src('package.json'); setTimeout(function() { console.log('start task four delay 1s'); return deferred.resolve(); }, 1); console.log('start task five'); return src;});
但这里的同步,是相对依赖的任务而言,如果依赖多个时,被依赖的各任务间,依然是异步执行。
如下例中所示,ex4_two 依赖不会等待 ex4_one 执行完成,而会优先执行,但是 ex4 则会等待依赖的三个任务全部执行完成后才会执行,也就是说,被依赖的任务中,有一个使用了同步,则意味着对整个任务实现了同步。
gulp.task('ex4', ['ex4_one', 'ex4_two', 'ex4_three'], function() { console.log('start example');});
- gulp入门2
- gulp入门(2)
- gulp入门(2)- gulp-uglify插件
- gulp开发:gulp入门
- gulp入门~
- Gulp入门
- Gulp入门
- gulp入门
- gulp入门
- gulp入门
- gulp 入门
- gulp 入门
- gulp入门
- gulp入门
- gulp入门
- gulp入门
- gulp入门
- gulp入门
- 数据库创建表失败原因
- 新的开始
- phantomjs的使用
- mysql中存取数据解决乱码问题(idea)
- Servlet生命周期
- gulp入门(2)
- 基于路由切换信息的过渡动效(2)
- angular.js 双向数据绑定,依赖注入
- 理解嵌入式开发中的一些硬件相关的概念
- StringBuffer的追加字符序列
- 卷积神经网络工作原理直观的解释
- 第六章作业
- Python库--pandas库学习笔记总结
- Markdown 语法和 MWeb 写作使用说明