Vue創建項目分為以下幾步:
- 安裝node
- 下載腳手架工具vue-cli
- 創建、並運行vue項目
1 安裝node
如果本地沒有安裝nodejs,那么需要安裝nodejs,已經安裝的也建議查看自己弄的版本,如果不是最新的版本也最好升級一下!同時最好也升級一下npm的版本。
下載安裝node:http://nodejs.cn/download/ node的下載沒有什么花哨,一路next,配置自己的安裝位置,同意用戶協議,就ok了!
下面說一下查看、更新 node 和npm版本的命令以及配置淘寶鏡像,這個是為了下載我們需要的模塊速度更快一些:
- 升級npm版本
npm install -g npm
- 查看npm鏡像
npm config get registry
- 切換淘寶鏡像
npm config set registry https://registry.npm.taobao.org
- 切換npm鏡像
npm config set registry https://registry.npmjs.org
2 下載腳手架工具vue-cli
安裝創建vue的腳手架工具vue-cli,這個工具能夠快速的幫我們創建一個vue的項目。
之前沒有下載過vue-cli的小伙伴,可以這樣:
npm install vue-cli -g
需要更新的小伙伴可以這樣:
** npm install @vue-cli -g**
如果在配置更新的過程,可能會有報錯,比如你的xx文件已經存在,嘗試刪除之后在重新下載等問題(我遇到的),在百度了好久,也試了好多方法,沒用,最后使用以下方法實現 vue-cli 更新:
1. 先全局卸載vue-cli: npm uninstall vue-cli -g
2. 重新下載:npm install vue-cli -g
做完上面這些可以檢測一下自己的vue-cli的版本:
vue -V
3 創建、並運行vue項目
vue 3.0之后呢可以用UI的界面來友好的幫你搭建項目。
第一步:在cmd中輸入: vue ui
第二步:如圖
第三步:具體選擇項目中的一些配置,全是界面是不是很友好呢!
第四步:手動配置我們項目。
第五步:根據自己項目需要選擇自己需要的東西。
第六步:創建完成。
第七步:導入到IDEA中(這里可以根據個人喜好VScode,webstorm都可以,我個人更喜歡idea)使用
npm run serve
第八步:點擊上面的地址,打開瀏覽器會有這個哦。到這里我們就成功的完成了項目的導入和部署了哦!
以上就是vue3.0搭建項目的過程,一起加油吧!
勇敢說出你的想法,哪怕聲音會顫抖。