Vue除錯工具vue devtools安裝使用

1、安裝vue-devtools

命令如下

2、在vue-devtools目錄中安裝依賴包

cd vue-devtools

cnpm install

4、把manifest.json中的"persistent":false改成true。儲存

5、然後用谷歌新增擴充套件程式，更多工具→擴充套件工具。點開就能看到

6、找到vue-devtools中的chrome目錄，選擇就行。vue的工具坑比較多乙個個填吧

7、上面這個提示顯示我們的路徑不對，所以我們找回剛剛的那個manifest.json的檔案。作者看了js的檔案應該沒什麼問題，就是啟動的main裡面沒配置

8、裡面有幾個路徑需要修改的，chrome檔案下沒有build這個路徑，改為src。可以直接拷**儲存就行。

9、然後我們重新新增擴充套件vue，就成功了

10、等等，還有重要的幾個操作沒完。通過cmd進入vue-devtools的目錄安裝依賴，使用如下命令

11、最後在輸入如下命令

npm run build

vue的除錯工具

上圖蠻有意思。vuejs用了很久了，大部分時候看下報錯資訊，結合vue.js devtools檢視下各個元件的資料其實就可以了，但是有時候還是有必要使用debugger的。話分兩頭，本文主要講兩個東西 vue.js devtools開發工具的使用 使用debugger和sourcemap除錯vue元...

vue 除錯工具 vue devtools

工欲善其事,必先利其器。解壓並進入 vue devtools 目錄下，安裝依賴包 cd vue devtools cnpm install 修改 vue devtools shells chrome manifest.json 檔案，將 persistent 改為 true 這一步不改也沒啥影響 在...

Vue除錯工具 vue devtools

vue除錯工具 vue devtools vue devtools是一款基於chrome遊覽器的外掛程式，用於除錯vue應用，這可以極大地提高我們的除錯效率。接下來我們就介紹一下vue devtools的安裝。1.找到 vue devtools的github專案，將其clone到本地 git clo...