下載Vue.js devtools的crx文件后，打開Chrome的擴(kuò)展頁面（chrome：// extensions /或按Chrome菜單圖標(biāo)>更多工具>擴(kuò)展程序查找），然后拖放 crx文件到擴(kuò)展頁面安裝它；
4、點(diǎn)擊“添加拓展程序”完成安裝。

5、Vue.js devtool插件安裝后無法使用，出現(xiàn)提示“vue.js not detected”，這時我們可以使用下面的方法：

第一，我們需要找到Vue.js devtool插件的安裝目錄。（如果真找不到插件的安裝位置，可以在本地電腦搜索插件的ID：nhdogjmejiglipccpnnnanhbledajbpd。）不同操作系統(tǒng)中chrome插件安裝位置不同，比如win8系統(tǒng)中chrome插件的安裝位置：C:UsersAdministratorAppDataLocalGoogleChromeUser DataDefaultExtensionsnhdogjmejiglipccpnnnanhbledajbpd
第二，在找到了Vue.js devtool插件的安裝目錄后，打開mainifest.json文件（這是關(guān)鍵）。

將mainfest.json中代碼persistent：false，修改成persistent：true。如下圖所示：

一般情況下，修改完如上的位置的代碼。打開vue項(xiàng)目后，在控制臺選擇vue，就應(yīng)該可以正常使用了。

第三，如果通過上面的方法調(diào)整過后，還是不能夠使用，那么可以調(diào)整一下webpack.config.js的代碼，如下圖所示：

最后，重啟一下你的vue項(xiàng)目應(yīng)該就可以使用了。

二、源代碼安裝方法

1、在github下載devtools源碼，地址：https://github.com/vuejs/vue-devtools。

2、下載好后進(jìn)入vue-devtools-master工程 執(zhí)行cnpm install, 下載依賴，然后執(zhí)行npm run build，編譯源程序。

3、編譯完成后，目錄結(jié)構(gòu)如下：

修改shells-chrome目錄下的mainifest.json 中的persistant為true：

?4、打開谷歌瀏覽器的設(shè)置--->擴(kuò)展程序，并勾選開發(fā)者模式

然后將剛剛編譯后的工程中的shells目錄下，chrome的整個文件夾直接拖拽到當(dāng)前瀏覽器中，并選擇啟用，即可將插件安裝到瀏覽器。

5、打開一個已有的vue項(xiàng)目，運(yùn)行項(xiàng)目，然后在瀏覽器中--->設(shè)置--->更多工具--->開發(fā)者工具，進(jìn)入調(diào)試模式：
發(fā)現(xiàn)vue.js is not detected? ，可以調(diào)整一下webpack.config.js的代碼：
?

最后，重啟一下你的vue項(xiàng)目應(yīng)該就可以使用了。
?

小結(jié)：Vue.js devtool插件安裝后出現(xiàn)提示“vue.js not detected”的問題，首先在擴(kuò)展程序中選擇開發(fā)者模式，打開插件的安裝目錄，將mainifest.json 中的persistant為true，如果還不行就調(diào)整一下webpack.config.js的代碼，最后重啟vue項(xiàng)目就可以使用。