vscode中執行gulp task的簡便方法

本文重點是gulp在vscode中執行task任務的方法

如何像webstorm那樣簡便操做gulp 的task

第1步：安裝node。下載地址：https://nodejs.org/zh-cn/

檢查是否安裝成功：Windows鍵+R快捷鍵打開cmd,輸入node -v查詢安裝的node版本，查詢到版本號，纔是安裝成功。

第2步：

下載插件：Gulp Snippets===>主要做用就是識別gulp

下載插件Gulp Tasks==>主要是管理任務，方便執行任務

以下

第3步：gulp的配置

一、在package.json文件中配置gulp,查詢結果以下

在powershell或者cmd（快捷鍵進入cmd方法後期單獨寫一篇介紹）中輸入（老生常談問題：注意路徑是否正確）

npm install gulp --save-dev

二、gulpfiles.js文件的創建，不能換其餘名字

三、引用gulp

const gulp=require(gulp")

四、寫測試gulp任務（可寫可不寫，我習慣性安裝好後調試一下看看是否報錯）

五、寫須要gulp執行的任務

 

第4步：

這裏重點說一下vscode怎樣便利的執行任務：

 

配置好gulp以及寫好任務後，執行任務方法以下：

一、能夠用gulp tasks這個工具欄，會自動識別你全部的gulp任務名，選擇執行便可

二、在powershell能夠直接輸入gulp+任務名字，注意：這裏須要高度注意，必須是根目錄下輸入命令，不然路徑是不對的，會報錯說這個文件裏找不到gulp，前提你是全局安裝以及依賴安裝過還報這種錯誤的話。

若是不在當前根目錄下，意思是多是在gulpfiles的「爺爺」路徑（這個問題多是建gulpfiles文件的時候路徑就錯了），經過輸入 cd xxx(gulpfiles的「爸爸」文件名)回車，進入gulpfiles的根目錄下，而後再輸入 gulp+任務名 執行任務

 

暫時總結的執行gulp任務的二種方法以下：

鼠標移入會有這個小圖標，

意思分別是：execute task 執行任務

terminate task 終止任務

restart task 從新啓動任務

refresh task 刷新任務

csdn博客地址https://blog.csdn.net/weixin_36706903/article/details/80990568