Vue調試工具 vue-devtools

vue-devtools是一款基於chrome瀏覽器的插件,能夠幫咱們快速調試vue項目

 

vue-devtools手動安裝：

　　第一步：找到vue-devtools的github項目（https://github.com/vuejs/vue-devtools），並將其clone到本地

　　

　　

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

 

　　

 

　　　第三步：編譯項目文件 ： npm run build

　　

　　　第四步：添加至chrome瀏覽器

　　　　1. 瀏覽器輸入地址：chrome://extensions ,進入擴展程序頁面。

　　　　2. 點擊「加載已解壓的擴展程序...」按鈕，選擇vue-devtools-master/shells/chrome 點擊肯定按鈕

 

　　　　　

　　　　　　添加完成後以下：

　　　　　　　　

　　　　　

vue-devtools 使用：

　　添加完vue-devtools擴展程序後，咱們在調試vue項目的時候，chrome開發者工具會看到vue一欄，能夠看到當前頁面vue對象的一些信息。