資訊專欄INFORMATION COLUMN
摘要：最近的項(xiàng)目需要寫的，大概的作用是去先去取一些文件，然后基于這些文件去生成另一些文件。由于文件之間有依賴關(guān)系，只有之間也存在先后順序，只有當(dāng)前一個(gè)結(jié)束了，后一個(gè)才能開始。結(jié)論的都要保證有或者，去通知系統(tǒng)任務(wù)結(jié)束。
最近的項(xiàng)目需要寫gulp的task，大概的作用是去先去svn取一些文件，然后基于這些文件去生成另一些文件。由于文件之間有依賴關(guān)系，只有tasks之間也存在先后順序，只有當(dāng)前一個(gè)task結(jié)束了，后一個(gè)task才能開始。
使用run-sequence（https://www.npmjs.com/package...）這個(gè)插件來保證順序，但是發(fā)現(xiàn)即使使用了這個(gè)插件，task之間仍然是異步的，后來網(wǎng)上搜索了下（https://stackoverflow.com/que...），得到以下結(jié)論，原因是我的gulp task沒有return，如果不return 系統(tǒng)不知道什么時(shí)候task結(jié)束（Without return the task system wouldn"t know when it finished.）所以即使是在run-sequence這個(gè)插件下，也無法保證按指定順序執(zhí)行。
結(jié)論： gulp的task都要保證有return或者callback，去通知系統(tǒng)任務(wù)結(jié)束。（make sure they either return a stream or promise, or handle the callback
var gulp = require("gulp");
var runSequence = require("run-sequence");
var del = require("del");
var fs = require("fs");
// This will run in this order:
// * build-clean
// * build-scripts and build-styles in parallel
// * build-html
// * Finally call the callback function
gulp.task("build", function(callback) {
runSequence("build-clean",
["build-scripts", "build-styles"],
"build-html",
callback);
});
// configure build-clean, build-scripts, build-styles, build-html as you wish,
// **but make sure they either return a stream or promise, or handle the callback**
// Example:
gulp.task("build-clean", function() {
// Return the Promise from del()
return del([BUILD_DIRECTORY]);
// ^^^^^^
// This is the key here, to make sure asynchronous tasks are done!
});
gulp.task("build-scripts", function() {
// Return the stream from gulp
return gulp.src(SCRIPTS_SRC).pipe(...)...
// ^^^^^^
// This is the key here, to make sure tasks run to completion!
});
gulp.task("callback-example", function(callback) {
// Use the callback in the async function
fs.readFile("...", function(err, file) {
console.log(file);
callback();
// ^^^^^^^^^^
// This is what lets gulp know this task is complete!
});
});
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/99162.html
摘要：當(dāng)接收一個(gè)回調(diào)函數(shù)的時(shí)候，一定要注意回調(diào)函數(shù)中的參數(shù)。主要作用就是用來讀取文件或者文件夾中的數(shù)據(jù)。表示文件的名稱指的是發(fā)生的變化使用技巧的進(jìn)一步使用，可以參照中文官網(wǎng)中的技巧集。 Gulp 簡介 Gulp 對(duì)現(xiàn)在的前端而言，是一個(gè)稍微老舊的工具了，但是，為了復(fù)習(xí)以前學(xué)過的內(nèi)容，還是把它翻出來，放在自己的博客中。說不定哪天又用到了呢。 需要說明的是，這里使用的 Gulp 版本是 3.9....
摘要：地址構(gòu)建基礎(chǔ)的語法轉(zhuǎn)譯環(huán)境首先，安裝工具，命令如下安裝插件，由于需要作為依賴，因此，還要安裝模塊和和之間的無縫集成插件安裝核心插件安裝完成后，配置文件和文件，將這兩個(gè)文件放在項(xiàng)目根目錄下。 gulp + gulp-better-rollup + rollup 構(gòu)建 ES6 開發(fā)環(huán)境 關(guān)于 Gulp 就不過多啰嗦了。常用的 js 模塊打包工具主要有 webpack、rollup 和 br...
摘要：基本用法基本根據(jù)匹配文件，返回，可以通過方法傳遞給后續(xù)的插件。一般用法，把中的內(nèi)容按照指定的寫成文件，會(huì)自動(dòng)創(chuàng)建不存在的文件夾。，用來代理請(qǐng)求，可以把發(fā)送到指定的地址。常用于開發(fā)，作用同上，也用于匹配資源，但用起來簡單很多。 基本用法 // gulpfile.js gulp.task(foo, function() { gulp.src(glob) .pipe(...
摘要：本文特此給大家介紹下如何使用配合來構(gòu)建基于的前端項(xiàng)目。最后，在目錄下會(huì)生成最終的項(xiàng)目文件。執(zhí)行單元測試本例中使用進(jìn)行單元測試。 隨著React、Angular2、Redux等前沿的前端框架越來越流行，使用webpack、gulp等工具構(gòu)建前端自動(dòng)化項(xiàng)目也隨之變得越來越重要。鑒于目前業(yè)界普遍更流行使用webpack來構(gòu)建es6(ECMAScript 2015)前端項(xiàng)目，網(wǎng)上的相關(guān)教程也比...
摘要：前端的發(fā)展真的是快，前幾年還是刀耕火種的開個(gè)編輯器，幾行和代碼就能上瀏覽器跑了。是啥官方的解釋是基于流的自動(dòng)化構(gòu)建工具。把運(yùn)動(dòng)的半成品看成是數(shù)據(jù)，那么流動(dòng)的數(shù)據(jù)就是流。分工明確才能提高效率，這是社會(huì)發(fā)展的經(jīng)驗(yàn)總結(jié)。 前端的發(fā)展真的是快，前幾年還是刀耕火種的開個(gè)編輯器，幾行html和js代碼就能上瀏覽器跑了?，F(xiàn)在呢？各種包，各種庫，各種框架，各種編程范式。究其原因，就是我們高中社會(huì)課本中...
閱讀 2234·2021-11-22 15:29
閱讀 4114·2021-11-04 16:13
閱讀 1000·2019-08-29 16:58
閱讀 346·2019-08-29 16:08
閱讀 1467·2019-08-23 17:56
閱讀 2393·2019-08-23 17:06
閱讀 3172·2019-08-23 16:55
閱讀 2068·2019-08-23 16:22
