安裝node.js以及搭建vue項(xiàng)目過(guò)程中遇到的問(wèn)題詳解
一、node.js安裝
進(jìn)入官網(wǎng) https://nodejs.org/en/download/
直接點(diǎn)擊下載安裝！安裝過(guò)程直接下一步就行；
二、如何找node.js歷史版本
(https://nodejs.org/en/download/)
1.點(diǎn)擊DOWNLOADS
2.點(diǎn)擊頁(yè)面下方
3.翻頁(yè)找到歷史版本
找到合適的版本點(diǎn)擊下載：
下載后綴為 .msi 的文件進(jìn)行安裝；
三、檢查是否安裝成功？
1.打開(kāi)命令窗口（win+R 輸入cmd）
2.輸入 node -v 然后回車顯示版本號(hào)即安裝成功；
四、安裝成功后需要配置環(huán)境變量：
以下內(nèi)容參考文章:http://www.fzitv.net/article/251052.htm
1.在安裝目錄下新建兩個(gè)空的文件夾在我安裝的文件夾 node_global 及 node_cache
2.創(chuàng)建完兩個(gè)空文件夾之后，打開(kāi)cmd命令窗口，輸入（填寫(xiě)自己的安裝路徑）
npm config set prefix "F:\Software\nodejs\node_global" npm config set cache "F:\Software\nodejs\node_cache"
3.設(shè)置環(huán)境變量，“我的電腦”-右鍵-“屬性”-“高級(jí)系統(tǒng)設(shè)置”-“高級(jí)”-“環(huán)境變量”：
① 在【系統(tǒng)變量】下新建【NODE_PATH】，輸【F:\Software\nodejs\node_modules】；
② 將【用戶變量】下的【Path】中原來(lái)npm路徑修改為【F:\Software\nodejs\node_global】
4.測(cè)試環(huán)境變量配置是否成功
cmd輸入cnpm -v
五、環(huán)境搭建
（1）安裝淘寶鏡像
cmd輸入 npm install -g cnpm --registry=https://registry.npm.taobao.org
報(bào)錯(cuò)：
解決辦法：降低版本 cmd輸入 npm install npm@4.6.1 -g
（2）安裝vue-cli 腳手架 在cmd命令窗口中：輸入 cnpm install vue-cli -g
測(cè)試是否安裝成功
直接輸入vue -V 回車，若顯示vue版本即安裝成功
（3）全局安裝webpack-cli
輸入命令：npm install -g webpack
六、項(xiàng)目創(chuàng)建
1.創(chuàng)建一個(gè)存放項(xiàng)目的文件夾，在vscode中打開(kāi)這個(gè)文件夾：
菜單欄–【文件】–【打開(kāi)文件夾】，然后點(diǎn)擊【終端】—【新建終端】；
2.進(jìn)入該目錄下的終端 輸入 vue init webpack demo
出現(xiàn)project name 時(shí)需要手動(dòng)回車往下走
此處報(bào)錯(cuò)：
npm ERR! cb.apply is not a function
npm ERR! A complete log of this run can be found in:
npm ERR! F:\Software\nodejs\node_cache_logs\2022-03-14T08_24_28_433Z-debug.log
解決辦法：npm版本過(guò)舊
windows下cmd安裝指令：cnpm install -g npm
重新在項(xiàng)目終端輸入，此處需切換到創(chuàng)建的項(xiàng)目目錄下運(yùn)行 npm run dev
報(bào)錯(cuò)：
解決辦法：
在終端輸入 npm i webpack-dev-server -D 運(yùn)行
最后重新運(yùn)行 npm run dev
出現(xiàn)nodejs訪問(wèn)請(qǐng)求，允許即可在瀏覽器打開(kāi)頁(yè)面；也可手動(dòng)復(fù)制地址在瀏覽器打開(kāi)；
總結(jié)
到此這篇關(guān)于安裝node.js以及搭建vue項(xiàng)目過(guò)程中遇到的問(wèn)題詳解的文章就介紹到這了,更多相關(guān)安裝node.js及搭建vue項(xiàng)目?jī)?nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue項(xiàng)目npm?run?build打包dist文件及打包后空白解決辦法
npm run build 這個(gè)命令會(huì)執(zhí)行Vue CLI中預(yù)定義的打包配置,并將打包后的文件存放在"dist"文件夾中,這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目npm?run?build打包dist文件及打包后空白的解決辦法,需要的朋友可以參考下2023-10-10
本篇文章通過(guò)實(shí)例給大家分析了Vue.js中router傳參的相關(guān)知識(shí)點(diǎn)，對(duì)此有興趣的朋友參考學(xué)習(xí)下。2018-04-04
vue實(shí)現(xiàn)表格數(shù)據(jù)的增刪改查
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)表格數(shù)據(jù)的增刪改查，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
利用Vue實(shí)現(xiàn)一個(gè)累加向上漂浮動(dòng)畫(huà)
在不久之前,看到一個(gè)比較有意思的小程序,就是靜神木魚(yú),可以實(shí)現(xiàn)在線敲木魚(yú),自動(dòng)敲木魚(yú),手盤佛珠,靜心頌缽的，下面就來(lái)揭秘如何實(shí)現(xiàn)這個(gè)小程序中敲木魚(yú)的累加向上漂浮動(dòng)畫(huà)，需要的可以參考一下2022-11-11
Vue3實(shí)現(xiàn)跨頁(yè)面?zhèn)髦档膸追N常見(jiàn)方法
在Vue 3中,跨頁(yè)面?zhèn)髦悼梢酝ㄟ^(guò)多種方式實(shí)現(xiàn),具體選擇哪種方法取決于應(yīng)用的具體需求和頁(yè)面間的關(guān)系,本文列舉了幾種常見(jiàn)的跨頁(yè)面?zhèn)髦捣椒?感興趣的同學(xué)跟著小編來(lái)看看吧2024-04-04
這篇文章主要介紹了基于element-UI input等組件寬度修改方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-03-03
在uniapp中,vue的生命周期的用法基本都得以保留,但是對(duì)于特殊的需求以及特殊的情況,uniapp還引入了一些特有的生命周期鉤子,本文給大家詳細(xì)介紹了vue生命周期在uniapp中的用法,感興趣的朋友可以參考下2024-01-01
Ant?Design?是一個(gè)開(kāi)源庫(kù)，可讓您創(chuàng)建吸引人的響應(yīng)式網(wǎng)站。如果您想使用經(jīng)過(guò)充分測(cè)試且易于學(xué)習(xí)的框架，那么它是您下一個(gè)項(xiàng)目的絕佳選擇，這篇文章主要介紹了如何在?Vue?3?中使用?Ant?Design,需要的朋友可以參考下2023-04-04
Form組件提供了表單驗(yàn)證的功能,只需要通過(guò)屬性傳入約定的驗(yàn)證規(guī)則,并將Form-Item的屬性設(shè)置為需校驗(yàn)的字段名即可,下面這篇文章主要給大家介紹了關(guān)于Element中el-form表單的相關(guān)資料,需要的朋友可以參考下2023-01-01
Vue3.0中如何監(jiān)聽(tīng)props方法
這篇文章主要介紹了Vue3.0中如何監(jiān)聽(tīng)props方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04