網上關於vue-devtools的安裝數不勝數，但是自己操作起來卻總是遇到問題。
寫下這篇隨筆，以防以后忘記。
vue-devtools是一款基於chrome游覽器的插件，用於調試vue應用，這可以極大地提高我們的調試效率。當然網上教程確實多，很容易理解，但是新手操作實在會卡住。
這里介紹一篇，大家可以去看看https://blog.csdn.net/zhousenshan/article/details/81583798。
我這里寫下我安裝的全過程，以及走過的彎路，及解決辦法。
方法一：
chrome商店直接安裝
vue-devtools可以從chrome商店直接下載安裝，非常簡單，這里就不過多介紹了。不過要注意的一點就是，需要翻牆才能下載。
方法二：（主要講方法二）
一、下載chrome擴展插件
GitHub下載地址：
https://github.com/vuejs/vue-devtools
這個下載的話：
下載zip格式的文件
二、解壓到本地
記得看清楚文件的目錄，等會需要訪問到此目錄，當然你也可以解壓在c盤，不建議什么東西都往c盤扔；
三、win+r 輸入 cmd 打開命令行操作
為了方便新手，cmd也敲出來；
像很多操作都是cnpm install，npm install ，npm run build等操作；等下再介紹，先進入我們解壓文件的目錄：
進入后輸入 cnpm install；可以看下，會有錯誤，當然如果你下載了npm，cnpm，自然不會報錯；
之前卡這里很久，到處找，沒有找到，畢竟新手。
npm：node.js下的包管理，下載node.js 會附帶npm。然后我又跑去找node.jsde的下載方法。介紹大家可以去看這個
node.js下載博客：
https://www.cnblogs.com/goldlong/p/8027997.html
node.js的下載網址：
http://nodejs.cn/download/
由於我的電腦是64位的windows系統；
查看電腦屬性就不介紹了；
下載完成后，雙擊安裝
一路next，到了安裝目錄后，默認C盤，（建議改成D盤，自己新建的目錄）
我的是D盤，nodejs，選好后點擊next。
這里需要主要，點擊add to path,不需要配置環境，不然又得去操作環境配置，還有這邊下載安裝完成后，不要隨便改變文件夾，不然得重新配置環境變量。。。。。點擊next，install，finish。。。
下載完成后會在你的文件夾有：那個.msi是我之前下的，可以刪除
現在可以去操作npm 了，記得重新打開命令行，首先查看環境變量，會發現自動配好了node，和npm，你會發現現在兩個居然不在同一個文件夾
輸入node -v ，npm -v可以查看剛才下載的node，npm的版本；注意不要忘記輸入空格。
現在只是安裝了npm，還有cnpm需要安裝
輸入這個命令： npm install -g cnpm --registry=https://registry.npm.taobao.org
輸入： cnpm -v 檢查版本，
四、cnpm install，npm run build 等操作
現在我們可以回到vue-devtool的下載了。。。。。。記得需要進入自己下載解壓文件的位置
雖然我也不知道是在干啥，但是我知道應該是成功了：
時間有點長，需要耐心等一等。。。。
cnpm install操作完成后進行npm run build
完成后顯示：
然后進去到文件夾內，一定是shells下的chrome的manifest.json文件，
進入本地編輯器，做如下圖修改，false 改成 true
五、擴展Chrome插件
打開chrome瀏覽器，打開設置>點擊或者程序>點擊開發者模式>加載已解壓的擴展程序
