第一步：安裝node
1、去官網(wǎng)下載node之后，推薦安裝穩(wěn)定版本（LTS）以及安裝路徑為系統(tǒng)盤(pán)（C）
node官網(wǎng)安裝地址
2、查看node安裝成功否
注釋：以下命令使用 命令提示符（管理員）權(quán)限,win10 對(duì)user權(quán)限的限制了訪問(wèn)權(quán)限。
node -v 查看node版本
npm -v 查看npm版本
where node 查看node安裝位置 www.56bk.cn 整理
注意:node 版本號(hào)大于npm版本號(hào)，基于之前安裝版本過(guò)低，后面會(huì)報(bào)錯(cuò)。
安裝路徑非系統(tǒng)盤(pán)（例D盤(pán)），出現(xiàn)用戶目錄丟失問(wèn)題解決
上圖標(biāo)注的文件目錄可能丟失，解決辦法：
主動(dòng)創(chuàng)建目錄,更新npm配置為新建目錄路徑，例 D:\nodejs
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"
npm 運(yùn)行慢，配置國(guó)內(nèi)淘寶鏡像包
npm config set registry https://registry.npm.taobao.org
后續(xù)包安裝命令 npm 即可改為 cnpm
第二步：配置node環(huán)境變量
我的電腦(屬性)->高級(jí)系統(tǒng)設(shè)置->環(huán)境變量編輯-保存
編輯path環(huán)境變量，新增node安裝路徑
www.56bk.cn 整理
增加環(huán)境變量NODE_PATH 配置的內(nèi)容為node_modules 路徑
已經(jīng)搭建好框架的項(xiàng)目直接跳轉(zhuǎn) 步驟6 進(jìn)行項(xiàng)目啟動(dòng)即可
第三步：安裝VUE
npm install vue -g
-g是指安裝到node_global全局目錄去
第四步：安裝Vue-cli
運(yùn)行 npm install vue-cli -g
安裝vue腳手架
第五步：webpack構(gòu)建項(xiàng)目
命令行進(jìn)入構(gòu)建項(xiàng)目的路徑 例：cd D:\vue-project
構(gòu)建vue項(xiàng)目名 vue01
運(yùn)行 vue init webpack vue01 構(gòu)建項(xiàng)目并配置相關(guān)項(xiàng)
項(xiàng)目構(gòu)建成功
第六步：項(xiàng)目啟動(dòng)
運(yùn)行 npm install 下載項(xiàng)目依賴包
運(yùn)行 npm run dev 本地啟動(dòng)
運(yùn)行成功，在瀏覽器驗(yàn)證
瀏覽器驗(yàn)證成功，就此基本VUE目錄框架搭建完成，開(kāi)始模塊開(kāi)發(fā)了~~
第七步：靈活改變運(yùn)行默認(rèn)端口8080，避免端口沖突
第八步：項(xiàng)目打包
運(yùn)行 npm run build 進(jìn)行線上打包
打包項(xiàng)目代碼,一般默認(rèn)從src目錄代碼壓縮混淆到dist目錄下。
好了，以上就是Win10系統(tǒng)下安裝Vue環(huán)境信配置各種環(huán)境變量，端口更改等一些步驟，相信會(huì)給一些用戶一些幫助的。