vue3.0 搭建教程(ui界面創建項目,幫你快速搭建所需模塊,非常nice)


Vue創建項目分為以下幾步:

  1. 安裝node
  2. 下載腳手架工具vue-cli
  3. 創建、並運行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搭建項目的過程,一起加油吧!

勇敢說出你的想法,哪怕聲音會顫抖。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM