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的配置

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

在powershell或者cmd(快捷鍵進入cmd方法后期單獨寫一篇介紹)中輸入(老生常談問題:注意路徑是否正確) 支持asp.net4.0的注冊命令使用方法

npm install gulp --save-dev

2、gulpfiles.js文件的建立,不能換其他名字

3、引用gulp

const gulp=require(gulp")

4、寫測試gulp任務(可寫可不寫,我習慣性安裝好后調試一下看看是否報錯)

5、寫需要gulp執行的任務

 

第4步:

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

 

配置好gulp以及寫好任務后,執行任務方法如下:

1、可以用gulp tasks這個工具欄,會自動識別你所有的gulp任務名,選擇執行即可

2、在powershell可以直接輸入gulp+任務名字,注意:這里需要高度注意,必須是根目錄下輸入命令,否則路徑是不對的,會報錯說這個文件里找不到gulp,前提你是全局安裝以及依賴安裝過還報這種錯誤的話。

如果不在當前根目錄下,意思是可能是在gulpfiles的“爺爺”路徑(這個問題可能是建gulpfiles文件的時候路徑就錯了),通過輸入 cd xxx(gulpfiles的“爸爸”文件名)回車,進入gulpfiles的根目錄下,然后再輸入 gulp+任務名 執行任務

 

暫時總結的執行gulp任務的二種方法如下:

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

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

terminate task 終止任務

restart task 重新啟動任務

refresh task 刷新任務

 

本文來源 https://dwz.pm/7m


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM