溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

vue-devtools的安裝和使用步驟詳解

發(fā)布時(shí)間：2020-09-23 06:31:47 來(lái)源：腳本之家 閱讀：120 作者：Ariela 欄目：web開(kāi)發(fā)

1、下載壓縮包，github下載地址：https://github.com/vuejs/vue-devtools

vue-devtools的安裝和使用步驟詳解

 2、解壓此文件夾

3、用命令提示符或編譯器進(jìn)入此文件夾

4、在文件夾下依次運(yùn)行（可以在命令提示符窗口也可在編譯器中）：

  I、npm install安裝所需要的依賴

 II、npm run build構(gòu)建（如果未執(zhí)行此步，shells->chrome文件夾下會(huì)缺少build文件夾）

vue-devtools的安裝和使用步驟詳解

5、在shells->chrome->manifest.json文件中修改 background 下 persistent 的值為 true

vue-devtools的安裝和使用步驟詳解

 6、在chrome瀏覽器中找到設(shè)置->擴(kuò)展程序，然后開(kāi)啟開(kāi)發(fā)者模式，將插件中shells文件夾下的chrome文件夾直接拖到開(kāi)啟了開(kāi)發(fā)模式的擴(kuò)展程序頁(yè)面，完成安裝。

vue-devtools的安裝和使用步驟詳解

 7、在插件文件目錄下運(yùn)行npm run dev,至此插件已成功安裝，打開(kāi)本地localhost:8080就可以看到插件成功安裝并運(yùn)行。

vue-devtools的安裝和使用步驟詳解

8、用chrome瀏覽器打開(kāi)本地的其他項(xiàng)目，就可以看到瀏覽器已成功的安裝了vue-devtools，可以用瀏覽器去調(diào)試vue項(xiàng)目啦。（此時(shí)不需要再在插件文件夾下運(yùn)行npm run dev）

vue-devtools的安裝和使用步驟詳解

以上就是本次關(guān)于vue-devtools的安裝和使用的全部知識(shí)點(diǎn)內(nèi)容，感謝大家的學(xué)習(xí)和對(duì)億速云的支持。

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手