使用Vite構建工具快速建立Vue專案

TANKING發表於2022-05-05

和Webpack相比,Vite具有以下特點

1、快速的冷啟動,不需要等待打包
2、即時的熱模組更新,真正的按需編譯,不用等待整個專案編譯完成

Vite構建Vue專案

前提:安裝Node.js和Vite

第一步
通過npm建立Vite專案

npm init vite-app 專案名稱
# 例如
npm init vite-app HelloVue

第二步
當專案建立成功後,cd到專案目錄

cd 專案名稱
# 例如
cd HelloVue

第三步
安裝專案依賴

npm install

第四步
執行專案

npm run dev

image.png

構建過程可能會發生的一些問題

1、npm install命令很慢或者卡住不動,可以參考:
https://blog.csdn.net/qq_39595769/article/details/123055196

image.png
image.png

2、npm run dev提示“vite不是內部或外部命令”,可能你還沒安裝vite,可以輸入以下命令進行安裝。

image.png

npm install vite

image.png

安裝成功再次npm run dev應該就沒問題了。

作者:TANKING
WeChat:sansure2016

相關文章