gulp顺序执行任务
gulp的任务的执行是异步的。
所以,当我写完一系列的任务,准备一股脑地执行。
#
gulp.task('prod', ['clean', 'compass', 'image', 'style', 'html', 'ftp']);
[10:22:54] Starting 'clean'...
[10:22:54] Starting 'compass'...
[10:22:54] Starting 'imagemin'...
[10:22:54] Starting 'style'...
[10:22:54] Starting 'html'...
[10:22:54] Starting 'ftp'...
[10:22:54] Finished 'style' after 88 ms
[10:22:54] Finished 'html' after 86 ms
[10:22:54] Finished 'clean' after 255 ms
[10:22:54] Finished 'ftp' after 549 ms
[10:22:55] Finished 'compass' after 1.5 s
[10:22:56] gulp-imagemin: Minified 15 images (saved 337.01 kB - 30.8%)
[10:22:56] Finished 'imagemin' after 2.46 s
[10:22:56] Starting 'prod'...
[10:22:56] Finished 'prod' after 14 μs
这不是我想要的/(ㄒoㄒ)/~~。任务完全错乱了。ftp上并没有看到我要的文件,因为其他任务还没执行完ftp任务就已经执行了。
我想要的是:('clean', 'compass', [image', 'style', 'html'],'ftp'),圆括号里面串行,中括号里面并行。可以给每个任务写依赖,但是好麻烦,而且有时候多个依赖,依赖与依赖之间依赖。算了。用插件。
var runSequence = require('gulp-run-sequence');
gulp.task('prod', function(cb) {
runSequence('clean', 'compass', ['image', 'style', 'html'], 'ftp', cb);
});
[15:20:32] Starting 'prod'...
[15:20:32] Starting 'clean'...
[15:20:32] Finished 'clean' after 23 ms
[15:20:32] Starting 'compass'...
[15:20:33] Finished 'compass' after 1.21 s
[15:20:33] Starting 'image'...
[15:20:33] Starting 'style'...
[15:20:33] Starting 'html'...
[15:20:33] Finished 'style' after 49 ms
[15:20:33] Finished 'html' after 55 ms
[15:20:36] gulp-imagemin: Minified 15 images (saved 337.01 kB - 30.8%)
[15:20:36] Finished 'image' after 2.26 s
[15:20:36] Starting 'ftp'...
[15:20:36] Finished 'ftp' after 82 ms
[15:20:36] Finished 'prod' after 3.58 s
【2015/7/13 update: gulp-run-sequrence插件https://www.npmjs.com/package/gulp-run-sequence 已弃用了,可以用gulp-sequence代替https://github.com/teambition/gulp-sequence 】
解决。
也可以用gulp 4.0, 虽然还没正式发布,但是试用了一下,超好。
首先我们要卸了之前装的3.x先,然后重装4.0
# 卸载全局的 gulp
$ npm uninstall gulp -g
# 安装全局的 gulp 4.0
$ npm install "gulpjs/gulp-cli#4.0" -g
$ npm install "gulpjs/gulp#4.0" -g
# 到项目目录里删掉本地的 gulp
$ npm rm gulp --save-dev
# 安装本地的 gulp 4.0
$ npm install "gulpjs/gulp#4.0" --save-dev
然后。就可以这样写我们的任务了
#
gulp.task('prod', gulp.series('clean', 'compass', gulp.parallel('image', 'style', 'html'), 'ftp'));
series里的任务是顺序执行的,parallel里的任务是同时执行的。
执行gulp prod
看一下效果
[15:36:53] Starting 'prod'...
[15:36:53] Starting 'clean'...
[15:36:54] Finished 'clean' after 24 ms
[15:36:54] Starting 'compass'...
[15:36:55] Finished 'compass' after 1.28 s
[15:36:55] Starting 'parallel'...
[15:36:55] Starting 'image'...
[15:36:55] Starting 'style'...
[15:36:55] Starting 'html'...
[15:36:55] Finished 'style' after 67 ms
[15:36:55] Finished 'html' after 67 ms
[15:36:57] gulp-imagemin: Minified 15 images (saved 337.01 kB - 30.8%)
[15:36:57] Finished 'image' after 2.25 s
[15:36:57] Finished 'parallel' after 2.25 s
[15:36:57] Starting 'ftp'...
[15:36:57] Finished 'ftp' after 63 ms
[15:36:57] Finished 'prod' after 3.62 s
关于4.0: https://github.com/gulpjs/gulp/issues/803
gulp顺序执行任务的更多相关文章
- js的并行加载以及顺序执行
重新温习了下这段内容,发现各个浏览器的兼容性真的是搞大了头,处理起来很是麻烦. 现在现总结下并行加载多个js的方法: 1,对于动态createElement('script')的方式,对所有浏览器都是 ...
- 【原创】cs+html+js+css模式(七): 顺序执行与并发执行问题,IIS7及其以上版本的抛错问题解决
在进行开发的过程中,针对于这种模式,我们继承的IRequiresSessionState,这种对于我们的同一个IIS的执行中是顺序执行即一个ajax请求处理完成后,才能执行下一个ajax, ...
- testng xml中按顺序执行java类
如红字部份,将安顺序执行4个类 <?xml version="1.0" encoding="UTF-8"?><suite name=" ...
- js的并行加载与顺序执行
javaScript文件(下面简称脚本文件)需要被HTML文件引用才能在浏览器中运行.在HTML文件中可以通过不同的方式来引用脚本文件,我们需要关注的是,这些方式的具体实现和这些方式可能会带来的性能问 ...
- testng.xml顺序执行多个case配置
testng.xml顺序执行多个case配置 项目结构如图:
- 顺序执行到来的消息 actor
在某项目里,有个 actor 需要做一些持久化的操作,这些操作耗时比较久,理应使用异步的代码来写,但是需求又强调每次只能做一个持久化操作,后来的请求应该等待.一个显然的做法是阻塞式的写,这样就能比较简 ...
- 多命令顺序执行、管道符 ; && || |
多命令顺序执行:
- C#之使用AutoResetEvent实现线程的顺序执行
前几天一朋友问我如何实现线程的顺序执行,说真的,虽然看过CLR这本书,也把线程部分拜读了两遍,但是这个问题出来之后还是没有一个思路.今天在搜索资料的时候无意中再次看到AutoResetEvent这个东 ...
- reduce + Promise 顺序执行代码
本文地址: http://www.cnblogs.com/jasonxuli/p/4398742.html 下午的太阳晒得昏昏沉沉,和上周五一样迷糊,看一段代码半天没看明白,刚才不知不觉眯了几分钟,醒 ...
随机推荐
- 与你相遇好幸运,Sails.js安装
官网: http://sailsjs.org Github:https://github.com/balderdashy/sails 开发文档: http://sailsjs.org/document ...
- java中常用的工具类(三)
继续分享java中常用的一些工具类.前两篇的文章中有人评论使用Apache 的lang包和IO包,或者Google的Guava库.后续的我会加上的!谢谢支持IT江湖 一.连接数据库的综合类 ...
- AngularJS 开发中常犯的10个错误
简介 AngularJS是目前最为活跃的Javascript框架之一,AngularJS的目标之一是简化开发过程,这使得AngularJS非常善于构建小型app原型,但AngularJS对于全功能的客 ...
- [LeetCode] Ugly Number II
Write a program to find the n-th ugly number. Ugly numbers are positive numbers whose prime factors ...
- ASP.NET 5探险(1):Azure中配置连接字符串、独立项目执行EF7数据迁移
(此文章同时发表在本人微信公众号“dotNET每日精华文章”,欢迎右边二维码来关注.) 题记:我开始把ASP.NET 5用于生产系统开发已经有1个多月了,也填了一些坑积累了一些经验,从今天开始会陆陆续 ...
- base64编码、解码的C语言实现
转自:http://www.cnblogs.com/yejianfei/archive/2013/04/06/3002838.html base64是一种基于64个可打印字符来表示二进制数据的表示方法 ...
- Java Server returned HTTP response code: 401
今天写一个小功能需要通过http请求获取一些返回数据,但是在登陆时是需要进行用户名和密码的校验的.写好之后请求,返回异常Java Server returned HTTP response code: ...
- Java中引用类 strong reference .SoftReference 、 WeakReference 和 PhantomReference的区别
当在 Java 2 平台中首次引入 java.lang.ref 包,其中包含 SoftReference . WeakReference 和 PhantomReference 三个引用类,引用类的 ...
- filter应用案例三:解决全站编码问题
1 说明 乱码问题: 获取请求参数中的乱码问题: POST请求:request.setCharacterEncoding("utf-8"): GET请求:new String(re ...
- Jmeter之录制脚本(二)
上一节已经已经介绍过Jmeter的安装,对于web测试的话,经常会用到一些脚本去执行某些功能,也就是所谓的半自动化测试, 对于不懂代码的童鞋来说,脚本是一个很头疼的概念,badboy的录制是一个对于刚 ...