2.1　使用Vite創建Vue3項目

本節講解使用Vite快速創建Vue3項目，使用Vite創建Vue3項目有哪些優點呢？

• 高效的開發體驗：Vite在開發階段具有驚人的速度，可以極大地提高開發效率。采用新的打包方式，可以在無須預先構建的情況下進行實時編譯，并且在修改代碼時自動更新瀏覽器，提高開發性能。
• 更少的依賴：Vite不再需要像傳統的Webpack那樣打包所有的依賴，這將減少構建的時間，減小輸出文件的大小，有助于提高性能。
• 靈活的配置選項：Vite提供了很多可以配置的選項，開發者可以根據項目的需求進行自定義，如CSS預處理器等。
• 支持熱模塊替換：Vite使用熱模塊替換實現在不刷新整個頁面的情況下更新應用程序的部分內容。

總體來說，使用Vite創建Vue3項目可以提供更靈活、更高效的開發體驗。

在了解了Vite的優點之后，讓我們深入了解如何使用Vite創建Vue3項目，下面將展示操作過程，幫助您構建一個全新的Vue3應用程序。

創建站點并在終端打開，在終端中運行下述命令安裝Vite。

npm create vite@latest my-vue-app -- --template vue

注意：

項目中的所有模塊均使用npm包管理器進行安裝。

Vite安裝完成之后運行cd命令，進入my-vue-app站點，運行npm install命令，安裝項目依賴，最后運行npm run dev命令，啟動Vue3項目，操作過程如圖2-1所示。

圖2-1

提示：

Vite需要Node.js的版本為14.18+，npm的版本為7+，當包管理器發出警告時，請注意升級Node.js的版本。