1. 程式人生 > >vue devtool的安裝與使用

vue devtool的安裝與使用

vue devtool是chrome的一個除錯外掛,翻不了牆的話只能手動安裝,方法如下:

1.首先是下載:
https://github.com/vuejs/vue-devtools
在這裡插入圖片描述

選擇下載安裝整個ZIP壓縮包


2.然後進行解壓縮,並在解壓後的資料夾裡面開啟命令提示符,
在這裡插入圖片描述

命令提示符應該是這個路徑(自己的軟體放置路徑)

升級一下npm,輸入:npm install npm -g
(此步驟沒有npm的話自己裝一下npm,npm對於node.js相當於pip對於python)

3.然後在相同的路徑裡面輸入:npm install
再輸入:npm run build
這兩步比較耗時

4.在編譯好的資料夾找到manifest.json這個檔案,一般所在的路徑是:
自己安裝的路徑\vue-devtools-dev\shells\chrome\manifest.json
然後開啟這個manifest.json,修改:
在這裡插入圖片描述

將persistent的值改為true

5.開啟chrome瀏覽器的擴充套件程式,
在這裡插入圖片描述

開啟開發者模式,然後將一整個chrome檔案直接拖到空白的地方,就會顯示好這個外掛了。