上圖蠻有意思。
vuejs用了很久了，大部分時候看下報錯資訊，結合vue.js devtools檢視下各個元件的資料其實就可以了，但是有時候還是有必要使用debugger的。
話分兩頭，本文主要講兩個東西：
vue.js devtools開發工具的使用；
使用debugger和sourcemap除錯vue元件（重點）
在chrome或firefox瀏覽器的擴充套件外掛程式倉庫裡搜vue devtool，安裝vue.js devtools後結合下面這張官方**，其他就不多說了，這不是本文重點。
針對vue-cli webpack官方腳手架，開啟build/webpack.dev.conf.js檔案，找到下面這句：
1
2
3
4
5
devtool
:'#cheap-module-eval-source-map'
,
將其修改為：
1
2
3
4
5
devtool
:'#eval-source-map '
,
要修改的地方已經都改好了，就是這麼簡單，驚不驚喜，意不意外。
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...
Vue除錯工具 vue devtools
vue devtools是一款基於chrome瀏覽器的外掛程式,可以幫我們快速除錯vue專案 vue devtools手動安裝 第一步 找到vue devtools的github專案 並將其clone到本地 第二步 安裝專案所需要的npm包 第三步 編譯專案檔案 npm run build 第四步 ...