Vue3?vue-devtools?調(diào)試工具下載安裝使用教程
更新時間：2022年08月12日 14:41:47 作者：NiKlaus729
vue-devtools是一款基于chrome游覽器的插件，用于調(diào)試vue應(yīng)用，這可以極大地提高我們的調(diào)試效率，尤其是對于初學(xué)vue的朋友來說可謂是一大利器，這篇文章主要介紹了Vue3?vue-devtools?調(diào)試工具下載安裝,需要的朋友可以參考下
官網(wǎng)下載地址：GitHub - vuejs/devtools: ?? Browser devtools extension for debugging Vue.js applications.
完成后解壓到目錄，解壓后目錄如下：
終端命令行進入到解壓后的Vue-Devtools目錄：
執(zhí)行命令下載yarn：
npm install -g yarn
安裝好yarn后，通過yarn來安裝相關(guān)依賴：
yarn install
依賴安裝完成后，開始打包build。
需要注意，這里的命令需要帶watch，如果不帶，會出錯：
yarn run build:watch
代碼執(zhí)行一陣后，沒有其他反應(yīng)，此時Ctrl+C退出即可。
接下來執(zhí)行dev：
yarn run dev:chrome
出現(xiàn)下面的界面后就可以Ctrl+C退出終端了：
此時，Vue-Devtools目錄下，生成了build目錄：
安裝
1、打開Chrome瀏覽器擴展程序
2、加載已解壓的程序
3、擴展欄固定vue-devtools程序
至此，Vue-Devtools插件安裝完成，打開使用vue3的網(wǎng)站，F(xiàn)12打開Chrome調(diào)試臺，可以看到Vue-Devtools的界面按鈕：
到此這篇關(guān)于Vue3vue-devtools調(diào)試工具下載安裝的文章就介紹到這了,更多相關(guān)vue-devtools調(diào)試工具內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家介紹了gulp模塊使用方法示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
這篇文章主要介紹了vue element input如何讓瀏覽器不保存密碼問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
Vant?UI中van-collapse下拉折疊面板默認展開第一項的方法
之前做項目的時候,使用了Collapse折疊面板,下面這篇文章主要給大家介紹了關(guān)于Vant?UI中van-collapse下拉折疊面板默認展開第一項的相關(guān)資料,需要的朋友可以參考下2022-03-03
這篇文章主要介紹了vue 插值表達式Mustache的相關(guān)資料，文中講解非常細致，代碼幫助大家更好的理解和學(xué)習(xí)，感興趣的朋友可以了解下2020-07-07
這篇文章主要為大家詳細介紹了vue實現(xiàn)循環(huán)切換動畫，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-10-10
vue為什么v-for的優(yōu)先級比v-if高原理解析
這篇文章主要為大家介紹了vue為什么v-for的優(yōu)先級比v-if高原理解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-05-05
這篇文章主要介紹了elementPlus修改主題色以及皮膚設(shè)置思路，具有很好的參考價值，希望對大家有所幫助。2023-04-04
這篇文章主要為大家介紹了Vue3?如何通過虛擬DOM更新頁面詳解,有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
這篇文章主要給大家介紹了關(guān)于VUE登錄注冊頁面的相關(guān)資料,在Vue中可以使用組件來構(gòu)建登錄注冊頁面,文中通過圖文以及代碼介紹的非常詳細,需要的朋友可以參考下2023-12-12
淺談vue使用axios的回調(diào)函數(shù)中this不指向vue實例,為undefined
這篇文章主要介紹了淺談vue使用axios的回調(diào)函數(shù)中this不指向vue實例,為undefined，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09