本文主要介紹 vue的調(diào)試工具 vue-devtools 的安裝和使用
chrome商店直接安裝
vue-devtools可以從chrome商店直接下載安裝，非常簡(jiǎn)單，這里就不過(guò)多介紹了。不過(guò)要注意的一點(diǎn)就是，需要翻墻才能下載。
安裝
1.下載依賴包
git clone https://github.com/vuejs/vue-devtools
2.安裝依賴包
- 1). cd vue-devtools
- 2). npm install 或 yarn
3.修改manifest.json文件
把"persistent":false改成true
4.編譯代碼
npm run build 或 yarn build
5.添加到Chrome擴(kuò)展插件
游覽器輸入地址“chrome://extensions/”進(jìn)入擴(kuò)展程序頁(yè)面, 打開開發(fā)者模式, 點(diǎn)擊加載已解壓擴(kuò)展程序,選擇vue-devtools>shells下的chrome文件夾。
vue-devtools使用
當(dāng)我們添加完vue-devtools擴(kuò)展程序之后，我們?cè)谡{(diào)試vue應(yīng)用的時(shí)候，chrome開發(fā)者工具中會(huì)看一個(gè)vue的一欄，點(diǎn)擊之后就可以看見(jiàn)當(dāng)前頁(yè)面vue對(duì)象的一些信息。vue-devtools使用起來(lái)還是比較簡(jiǎn)單的，上手非常的容易，這里就細(xì)講其使用說(shuō)明了。
