環境搭建推薦
vue推薦開發環境:
Node.js: javascript運行環境(runtime),不同系統直接運行各種編程語言
npm: Nodejs下的包管理器。由於國內使用npm會很慢,這里推薦使用淘寶NPM鏡像（http://npm.taobao.org/）
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
webpack: 它主要的用途是通過 CommonJS 的語法把所有瀏覽器端需要發布的靜態資源做相應的准備，比如資源的合並和打包。
vue-cli: 用戶生成Vue工程模板
第一步
安裝node.js 打開下載鏈接: https://nodejs.org/en/download/ 這里下載的是node-v6.9.2-x64.msi;
默認式的安裝，默認路徑放在d:mode.js（個人根據情況）
安裝成功！
新版的Node.js已自帶npm，安裝Node.js時會一起安裝，npm的作用就是對Node.js依賴的包進行管理，也可以理解為用來安裝/卸載Node.js需要裝的東西
查看是否安裝成功 1.node -v 2.npm -v
npm 是 Node.js 官方提供的包管理工具
第二步 基於node.js,利用淘寶cnpm鏡像安裝相關依賴在cmd里直接輸入：
npm install -g cnpm --registry=https://registry.npm.taobao.org，
回車，等待安裝...1-2分鍾。
第三步 .安裝全局vue-cli腳手架,用於幫助搭建所需的模板框架 在cmd里
1)輸入：cnpm install -g vue-cli，回車，等待安裝...
2).輸入：vue 回車，若出現vue信息說明表示成功 當前路徑下輸入：
第四步 創建項目，輸入：vue init webpack vue_test(項目文件夾名)，回車，等待時間較長。
解釋一下這個命令，這個命令的意思是初始化一個項目，其中webpack是構建工具，也就是整個項目是基於webpack的。
其中vue_test是整個項目文件夾的名稱
第五步 安裝依賴，輸入：cd vue_test（項目名），回車，
進入到具體項目文件夾 輸入：npm install，回車，vue 等待...。
如果安裝成功，回到項目文件夾，會發現項目結構里，多了一個node_modules文件夾（該文件里的內容就是之前安裝的依賴）
第六步 測試環境是否搭建成功：
方法1：輸入：npm run dev
方法2：在瀏覽里輸入：localhost:8080(默認端口為8080)
··········································
vue調試工具vue-devtools安裝及使用
1.git上的下載路徑：（找到存放的盤符，右鍵Git Bash Here）復制下面的網址，
把vue-devtools克隆下來或者是通過https://github.com/vuejs/vue-devtools把vue-devtools下載下來。
git clone https://github.com/vuejs/vue-devtools
2.在vue-devtools目錄下安裝依賴包
cd vue-devtools //進入vue-devtools目錄
cnpm install //安裝依賴
npm run build //(這一步一定不要忘了，沒有執行這一步的話，項目文件夾shells>chrome文件夾里會少一個src文件 會報錯無法加載背景腳本“build/background.js”
注：npm install 或者 cnpm install （cnpm命令是國內的鏡像，速度會快一些）
3.修改manifest.json文件
把"persistent":false改成true
4.編譯代碼 npm run build
5.擴展Chrome插件 Chrome瀏覽器 > 更多工具 > 拓展程序 點擊加載已解壓程序按鈕, 選擇 vue-devtools > shells > chrome 放入, 安裝成功如下圖
6. vue-devtools使用 vue項目, 打開f12, 選擇vue就可以使用了. vue是數據驅動的, 這樣就能看到對應數據了, 方便我們進行調試 溫情提示:
1）.vue必須引入開發版, 使用min壓縮版是不能使用devtools進行調試的
2）.安裝后, 需要關閉瀏覽器, 再重新打開, 才能使用
如果安裝依賴 運行環境改配置有問題 可以直接參考以下鏈接 直接配置好 拿來直接用
https://blog.csdn.net/weixin_38654336/article/details/80790698