本專案專案倉庫地址:https://gitee.com/notlaughingzzm/vue3_elementPlus_admin.git

1.node環境安裝

• 一定要確保你的電腦是有Node環境的

2.全域性安裝vue腳手架

• 檢視版本

• 1.通過vue腳手架來建立專案
  
• 2.通過vite來建立專案
  
  這個專案我們採用vite來建立專案,因為vite相較於webpack熱更新快很多

3.選擇vue版本

這裡不選擇vue-ts版本是因為,現在vue+ts還是有點坑的,等到後面再慢慢把ts的坑填過去,替換成vue+ts

4.建立完成

1.這裡我們yarn安裝依賴模組就好了
2.為什麼要用yarn呢,因為會生成yarn.lock檔案,也就說不管誰安裝,什麼時候安裝依賴包,都是Package.json裡面包的版本,不會造成時間的推移而導致依賴報錯問題

5.啟動專案

啟動成功 ,開啟埠,就可以看到我們的專案成功執行

看到這個頁面就成功啦

看到這裡network,就知道為什麼再看下原始碼,就知道vite為什麼會這麼快了

6.安裝專案所需外掛哈

1.不要搞混了-S 和-D的區別哈

• antD匯入
  

7.VSCode安裝外掛哈

8.目錄結構規範

• 1.建立基本的資料夾
  
• 2.配置vite.config.js

相當於vue.config.js
這裡先改一下基礎的配置,比如埠和host

9.配置環境變數process.env

1.直接在main.js呼叫是會報錯的

因為官方文件寫了哈,要新增import.meta

• 這樣就好了
  
  配置一下.env.dev
  
  也可以在package.json裡面去改dev的配置
  

重點:改了配置以後,一定要重啟,專案配置才會生效!!!!!!

• 生效了