1. 下載chrome的擴展程序包
github地址:https://github.com/vuejs/vue-devtools
2. 下載完成后,解壓到先關文件夾下。進入vue-devtools文件夾,開始安裝項目所需依賴包
命令:npm install (如果有國內鏡像環境,直接cnpm install就好了)
下載成功出現如下狀態:
3. 開始編譯項目文件:
命令: npm run build
4. 在vue-devtools文件夾下:shells>chrome>manifest.json,將配置里的persistent的值修改為true;
5. 打開chrome,進入擴展程序管理界面(chrome://extensions/),加載已解壓的擴展程序。選擇vue-devtools>shells>chrome。加載完成就會出現以下的Vue.js devtools擴展程序。然后重啟瀏覽器,再打開vue項目頁面就可以在chrome的Devtools(就是console的那一欄,一般都排在最后面的。)找到Vue面板了。