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

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

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

 

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

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

 

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

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

　　

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

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

　　　　（1）勾選開發者模式

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

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

 

4、安裝成功的頁面如下：

　　

 

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

 

 

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