最近在學(xué)習(xí)Vue.js,為了便于調(diào)試需要給Chrome瀏覽器安裝vue-devtools開(kāi)發(fā)工具
手動(dòng)安裝:
1. 到GitHub上找到vue-devtools的github項(xiàng)目吠裆,并將其clone到本地:
github地址:https://github.com/vuejs/vue-devtools
命令:git clone?https://github.com/vuejs/vue-devtools.git
2. 進(jìn)入vue-devtools項(xiàng)目文件安裝依賴:
命令:?
cd vue-devtools
npm install?
或者?
cnpm install(安裝了cnpm)
3.?編譯項(xiàng)目文件
npm run build
4.?添加至chrome瀏覽器
在Chrome地址欄輸入‘’chrome://extensions/”進(jìn)入擴(kuò)展程序頁(yè)面,點(diǎn)擊“加載已解壓的擴(kuò)展程序...”按鈕秃流,選擇vue-devtools>shells下的Chrome文件夾
圖1
游覽器輸入地址“chrome://extensions/”進(jìn)入擴(kuò)展程序頁(yè)面,點(diǎn)擊“加載已解壓的擴(kuò)展程序...”按鈕柳弄,選擇vue-devtools>shells下的chrome文件夾舶胀。
注意:如果看不見(jiàn)“加載已解壓的擴(kuò)展程序...”按鈕,則需要勾選“開(kāi)發(fā)者模式碧注;
或者:
設(shè)置 > 點(diǎn)擊擴(kuò)展程序 > 點(diǎn)擊開(kāi)發(fā)者模式>點(diǎn)擊“加載已解壓的擴(kuò)展程序”嚣伐,選擇vue-devtools>shells下的Chrome文件夾
圖2
下面界面是添加成功后的:
圖3