vue調試工具之 vue-devtools的安裝

這裏介紹一下vue-devtools的安裝方法之一：

chrome瀏覽器的應用商店不能直接訪問（須要跨域），因此直接應用商店安裝的方法就行不通了。

 

一、到github主頁去下載安裝：

git clone https://github.com/vuejs/vue-devtools

 

二、繼續執行如下命令（cnpm國內鏡像下載更快）：

cd vue-devtools　　　　　　 //進入當前目錄
cnpm install　　　　　　　  //下載依賴
npm run build　　　　　　   //打包

　　

三、進入chrome瀏覽器添加擴展程序：

　　chrome瀏覽器>> 更多工具>> 擴展程序，進入下圖頁面：

　　　　（1）勾選開發者模式

　　　　（2）點擊加載已解壓的擴展程序（選擇地址爲：安裝路徑>> vue-devtools>>shells>>chrome），將chrome文件夾導入

　　　　（3）點擊肯定就能安裝成功

 

四、安裝成功的頁面以下：

　　

 

五、此時地址欄右側出現vue的圖標，在vue項目下圖標變爲亮色，切可以在開發者工具中進行vue的調試：

 

 

你安裝成功了嗎？快使用vue-devtools進行vue項目開發吧！