發現自己每次安裝什麼都東西都能把網上教程遇到的所有問題遇到一遍QAQ，明白查一個問題搜索引擎前三頁都飄紅的痛嗎！！！
一、vue-devtools安裝 (chrome)（正確親測有效）
1.下載vue-devtools
（1）cmd下node指令：G:\Node>cnpm install -g vue-devtools
（或者npm指令，下載到node_modules文件夾裏或者你自己定義的全局目錄裏）
（2）網盤資源鏈接：https://pan.baidu.com/s/14B-CFqMcQxF72aRofWKeVQ
參考教程鏈接：https://coding.m.imooc.com/questiondetail.html?qid=61693
目錄結構：
2.瀏覽器中設置擴展
chrome設置->擴展程序->加載已解壓的擴展程序->選中下載路徑的vender包（node_modules\vue-devtools\vender），打開chrome右上角會有個發綠的“V”的vue標誌（發灰的話是vue.js not detected，沒有檢測到vue，找個有vue的頁面打開即可）。
3.給予vue項目相應權限
（比如運行bilibili等的站點點擊vue擴展顯示Vue.js is detected on this page. Devtools inspection is not available because it's in production mode or explicitly disabled by the author.就是說vue項目沒有賦予擴展權限）
my-vue\src\main.js文件中添加：
import Vue from 'vue'
Vue.config.devtools=true
這樣自己的vue項目就可以在瀏覽器開發工具的擴展程序裏調試了。
二、所遇問題（那些年我走過的彎路）
1.添加擴展程序時報錯：xxxx目錄xxxx，無法爲內容腳本加載 JavaScript“build/hook.js”
https://github.com/vuejs/vue-devtools 或者其他地方下載出來的目錄結構呈現如下的，我還是沒能運行成功（當然這可能是我太渣的問題。。。）
根據報錯build/hook.js，打開manifest.json文件看是不是文件索引的問題，
打開目錄發現這些hook.js文件等應該是在安裝裏的src文件夾裏的（比照上文正確有效安裝的目錄也可以看到），然後我把json文件裏的標紅的"build"全改成了"src"或者把src文件夾重命名爲了build，現在應用程序可以添加進去了。
然鵝，，，
2.vue-devtools擴展程序的“V”標籤發灰，沒亮，顯示vue.js not detected。
有的教程說在manifest.json文件裏把persistent的false改爲true，，後來改了一下沒有作用，然而好多教程都說這麼改，我就找了半天原理（具體在哪兒看的忘了），說是persistent爲true的話表示打開瀏覽器就默認一直加載這個擴展應用程序了，false的話只有遇到vue時纔有，就看vue使用頻率去設定，大概是這個意思吧，，我感覺跟not detected沒啥關係。
然後，我發現擴展程序那兒詳情信息旁邊有錯誤選項，我看它報了啥錯。。。
3.vue-devtools擴展程序錯誤：hook.js匿名函數：import { installHook } from 'src/backend/hook'標黃。
我以爲可能是他import語法的問題或者是後面路徑的問題，去找了找發現它引的是vue-devtools->src->backend->hook.js的installHook function，然後我就想會不會是src是上級目錄的問題，改../../../改了半天，沒效果後又複製了一個索引的hook.js放在了同級目錄中，，最終還是始終import不對，，，然後我就放棄了（如果以後研究了import的問題解決了再回來改，，），，上文成功案例中的hook.js就沒有import別的，應該就是把函數直接寫在了同一個hook.js裏了。。然後實在是不想再去扒它的目錄、索引、方法了，就找到了上文看起來簡單點的vue-devtools安裝，順利成功。。
至於爲什麼叨叨這麼多失敗的經歷，，也是爲了遇到這樣的報錯問題的時候別再走那麼多彎路了:(
以上。