Gulp task return 的作用

senntyou 發布于2019-08-23 13:01 / 1692人閱讀

摘要：最近的項目需要寫的，大概的作用是去先去取一些文件，然后基于這些文件去生成另一些文件。由于文件之間有依賴關系，只有之間也存在先后順序，只有當前一個結束了，后一個才能開始。結論的都要保證有或者，去通知系統任務結束。

最近的項目需要寫gulp的task，大概的作用是去先去svn取一些文件，然后基于這些文件去生成另一些文件。由于文件之間有依賴關系，只有tasks之間也存在先后順序，只有當前一個task結束了，后一個task才能開始。

使用run-sequence（https://www.npmjs.com/package...）這個插件來保證順序，但是發現即使使用了這個插件，task之間仍然是異步的，后來網上搜索了下（https://stackoverflow.com/que...），得到以下結論，原因是我的gulp task沒有return，如果不return 系統不知道什么時候task結束（Without return the task system wouldn"t know when it finished.）所以即使是在run-sequence這個插件下，也無法保證按指定順序執行。

結論： gulp的task都要保證有return或者callback，去通知系統任務結束。（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!
    });
});

GPU云服務器云服務器 php的return javascript的return gulp gulp4

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/99162.html

重讀 Gulp

摘要：當接收一個回調函數的時候，一定要注意回調函數中的參數。主要作用就是用來讀取文件或者文件夾中的數據。表示文件的名稱指的是發生的變化使用技巧的進一步使用，可以參照中文官網中的技巧集。 Gulp 簡介 Gulp 對現在的前端而言，是一個稍微老舊的工具了，但是，為了復習以前學過的內容，還是把它翻出來，放在自己的博客中。說不定哪天又用到了呢。需要說明的是，這里使用的 Gulp 版本是 3.9....

vpants 2019-08-22 11:19 評論0 收藏0
gulp + gulp-better-rollup + rollup 構建 ES6 開發環境

摘要：地址構建基礎的語法轉譯環境首先，安裝工具，命令如下安裝插件，由于需要作為依賴，因此，還要安裝模塊和和之間的無縫集成插件安裝核心插件安裝完成后，配置文件和文件，將這兩個文件放在項目根目錄下。 gulp + gulp-better-rollup + rollup 構建 ES6 開發環境關于 Gulp 就不過多啰嗦了。常用的 js 模塊打包工具主要有 webpack、rollup 和 br...

XBaron 2019-08-23 17:12 評論0 收藏0
利用 Gulp 處理前端工作流程

摘要：基本用法基本根據匹配文件，返回，可以通過方法傳遞給后續的插件。一般用法，把中的內容按照指定的寫成文件，會自動創建不存在的文件夾。，用來代理請求，可以把發送到指定的地址。常用于開發，作用同上，也用于匹配資源，但用起來簡單很多。基本用法 // gulpfile.js gulp.task(foo, function() { gulp.src(glob) .pipe(...

Yangder 2019-08-21 10:37 評論0 收藏0
基于 Gulp + Browserify 構建 ES6 環境下的自動化前端項目

摘要：本文特此給大家介紹下如何使用配合來構建基于的前端項目。最后，在目錄下會生成最終的項目文件。執行單元測試本例中使用進行單元測試。隨著React、Angular2、Redux等前沿的前端框架越來越流行，使用webpack、gulp等工具構建前端自動化項目也隨之變得越來越重要。鑒于目前業界普遍更流行使用webpack來構建es6(ECMAScript 2015)前端項目，網上的相關教程也比...

yuanxin 2019-08-19 18:05 評論0 收藏0
Gulp--手把手教你搭建前端自動化平臺

摘要：前端的發展真的是快，前幾年還是刀耕火種的開個編輯器，幾行和代碼就能上瀏覽器跑了。是啥官方的解釋是基于流的自動化構建工具。把運動的半成品看成是數據，那么流動的數據就是流。分工明確才能提高效率，這是社會發展的經驗總結。前端的發展真的是快，前幾年還是刀耕火種的開個編輯器，幾行html和js代碼就能上瀏覽器跑了。現在呢？各種包，各種庫，各種框架，各種編程范式。究其原因，就是我們高中社會課本中...

LeviDing 2019-08-20 18:26 評論0 收藏0