問題描述
我無法讓 gulp run-sequence
執(zhí)行我給它的兩個(gè)函數(shù)(它只會執(zhí)行其中一個(gè).我有這樣的事情:
gulp.task('wire', function(){gulp.src('./index.html').pipe(wiredep()).pipe(gulp.dest('.'));});var filesToInject = ['./app/**/*.js', './app/**/*.css'];gulp.task('注入', function (){var target = gulp.src('./index.html');var sources = gulp.src(filesToInject, {read: false});返回target.pipe(注入(來源)).pipe(gulp.dest('.'));});gulp.task('wire-inject', function(callback){序列('wire','inject',回調(diào));});
那只會運(yùn)行 inject
任務(wù).只有當(dāng)我在 wire
任務(wù)中的 gulp.src
之前添加一個(gè) return
時(shí),它才會執(zhí)行.我還在兩個(gè)函數(shù)參數(shù)中添加了回調(diào),并將其傳遞給每個(gè) 文檔的兩個(gè)任務(wù)中的最后一個(gè)管道一個(gè)>.
gulp.task('wire', function(callback){gulp.src('./index.html').pipe(wiredep()).pipe(gulp.dest('.'), 回調(diào));});var filesToInject = ['./app/**/*.js', './app/**/*.css'];gulp.task('inject', 函數(shù)(回調(diào)){var target = gulp.src('./index.html');var sources = gulp.src(filesToInject, {read: false});返回target.pipe(注入(來源)).pipe(gulp.dest('.'), 回調(diào));});
這并沒有引發(fā)任何錯(cuò)誤,但是如果我把它拿出來它不會改變?nèi)魏螙|西.這個(gè) return 語句做了什么神奇地使我的序列完全運(yùn)行.文檔中的這些回調(diào)是什么,我只是通過不帶括號的引用來執(zhí)行它們?即使它們看似什么都不做,我是否仍然需要它們?
Gulp 需要知道異步任務(wù)何時(shí)完成.您有 3 種方法可以做到這一點(diǎn):
返回一個(gè)事件流,這就是當(dāng)你的任務(wù)函數(shù)中有
return gulp.src(...).pipe(...);
時(shí)你所做的.p>返回一個(gè)承諾.
讓定義你任務(wù)的函數(shù)帶一個(gè)參數(shù).Gulp 將使用回調(diào)函數(shù)調(diào)用您的函數(shù),您應(yīng)該在任務(wù)結(jié)束時(shí)調(diào)用該回調(diào)函數(shù).
如果您不這樣做,那么 Gulp 將不會知道該任務(wù)是異步的.因此,它會在其函數(shù)返回后立即認(rèn)為任務(wù)已完成.這會帶來各種后果.Gulp 可以在任務(wù)完成之前退出.或者它可以在任務(wù) A 完成之前啟動依賴于任務(wù) A 的任務(wù) B.在某些情況下,您可能立即看不到問題,但隨著您的 gulpfile 變得越來越復(fù)雜,您出現(xiàn)不良行為的機(jī)會也越來越多.run-sequence
并不特殊:它需要知道任務(wù)何時(shí)完成才能正確完成工作.
請注意,您在問題中顯示的此代碼中的 callback
是無用的:
return target.pipe(inject(sources)).pipe(gulp.dest('.'), 回調(diào));
callback
不會被調(diào)用.將其替換為 function () { console.log("Hello!");打回來();}代碼>.您不會在控制臺上看到
Hello!
,因?yàn)槲凑{(diào)用回調(diào).但是,代碼確實(shí)可以正常工作,因?yàn)槟祷亓肆?Gulp 使用您返回的流來確定任務(wù)結(jié)束,而不是回調(diào)(無論如何都不會調(diào)用).
I was having trouble getting gulp run-sequence
to execute both functions that i gave it (it would only execute one of them. I had something like this:
gulp.task('wire', function(){
gulp.src('./index.html')
.pipe(wiredep())
.pipe(gulp.dest('.'));
});
var filesToInject = ['./app/**/*.js', './app/**/*.css'];
gulp.task('inject', function (){
var target = gulp.src('./index.html');
var sources = gulp.src(filesToInject, {read: false});
return target.pipe(inject(sources))
.pipe(gulp.dest('.'));
});
gulp.task('wire-inject', function(callback){
sequence('wire', 'inject', callback);
});
That would only run the inject
task. Only when I added a return
before gulp.src
in the wire
task would it execute. I also added callback in both function params and passed it to the last pipe in both tasks per the documentation.
gulp.task('wire', function(callback){
gulp.src('./index.html')
.pipe(wiredep())
.pipe(gulp.dest('.'), callback);
});
var filesToInject = ['./app/**/*.js', './app/**/*.css'];
gulp.task('inject', function (callback){
var target = gulp.src('./index.html');
var sources = gulp.src(filesToInject, {read: false});
return target.pipe(inject(sources))
.pipe(gulp.dest('.'), callback);
});
That did not throw any errors, however it doesn't change anything if I take it out. What does this return statement do that magically makes my sequence run completely. What are these callbacks in the documentation that I just pass a reference to with out parentheses to execute them? Do I still need them even though they seemingly do nothing?
Gulp needs to know when an asynchronous task is done. You have 3 ways to do this:
Return an event stream, which is what you do when you have
return gulp.src(...).pipe(...);
in your task's function.Return a promise.
Have the function that defines you task take a parameter. Gulp will call your function with a callback that you should call when the task is over.
If you do not do this, then Gulp will not know that the task is asynchronous. So it will consider the task done as soon as its function returns. This has all kinds of consequences. Gulp could exit before a task is done. Or it could start a task B that depends on task A before task A is complete. In some cases, you may not see a problem immediately but as your gulpfile gets more complex, you run more chances of getting bad behavior. run-sequence
is not special: it needs to know when a task is complete to do its job correctly.
Note that callback
in this code which you show in your question is useless:
return target.pipe(inject(sources))
.pipe(gulp.dest('.'), callback);
callback
won't be called. Replace it with function () { console.log("Hello!"); callback(); }
. You won't see Hello!
on the console because the callback is not called. However, the code does work overall because you return the stream. Gulp uses the stream you return to determine that the task is over, not the callback (which is never called anyway).
這篇關(guān)于Gulp 任務(wù)中`return` 語句和`callback` 參考的用途的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網(wǎng)!