Vue-devtools 安裝瀏覽器調試

 

工欲善其事，必先利其器。

本文主要講解Vue-devtools的安裝和使用

安裝方法有兩個：

方法一：（前提條件須要FQ，省事省力省心方便快速）

　　　　FQ =》谷歌商店 =》搜索 =》Vue-devtools =》添加至Chrome

方法二：

　　　一、克隆至本地：git clone（vue-devtools）

　　　二、安裝項目所須要的npm包：npm install

　　　三、編印項目文件：npm run build

　　　四、添加至chrome瀏覽器

　　　進入擴展頁面=》加載已解壓的擴展程序=》選擇vue-devtools>shells下的chrome文件夾

　　  /* 若是看不見「加載已解壓的擴展程序...」按鈕，則須要勾選開發者模式。 */

 

　　具體步驟如圖所示：

　　 　　最後：Vue-devtools如何使用呢？

　　當咱們在Chrome添加完擴展後，須要調試Vue應用時，Chrom開發者工具欄會有一個vue的一欄，點擊以後就能夠看到vue對象的一些信息。

 

 

溫情提示: 

1.vue必須引入開發版, 使用min壓縮版是不能使用devtools進行調試的

2.安裝後, 須要關閉瀏覽器, 再從新打開, 才能使用

 

若有問題歡迎掃碼加羣，大夥兒一塊兒入羣討論問題！

但願可以幫助到你們！！！謝謝合做！！！