一、Vite簡介
Vite作為新一代的前端構建工具，擁有以下幾個特點：
- 開發時效率極高
- 開箱即用，功能完善
- 社區豐富，兼容rollup
- 開發時超高速的熱重載，速度穩定
- 預設應用和類庫打包模式，減少項目配置內容
-
與前端框架（Vue、React、Angular）無關
image.png
總結：就是一個字就是快，原先用webpack構建的項目可能需要1-2分鐘的構建時間，而vite只需要2-3秒，開發時每次修改代碼，頁面基本都是實時更新。這和vite依賴于esbuild息息相關。
二、專題目標
- 掌握Vite的使用
1、 前端框架的集成
2、CSS、圖片、Wasm等的第三方資源的加載
3、TS、JSX不同語法集成
4、glob import
5、 預編譯文件
6、后端nodejs項目的集成 - Vite插件開發和實戰
1、rolluo、esbuiild的學習
2、Vite插件API詳解
3、學習官方插件用例 - Vite的源碼解析，理解Vite的原理
1、為什么Vite的性能如此快
2、Vite的HMR如何實現
3、服務端渲染原理
三、對前端構建工具構建流程的認知
我們知道，隨著前端應用越來越復雜，現在前端開發已經進入了前端框架時代（Vue、React、Angular），
現在的前端項目不僅僅只是幾個頁面幾個JS那么簡單的情況了，可能會有成百上千個js文件，那么構建工具是怎么把成百上千的js打包build成一個js文件的呢？所以構建是我們學習前端逃不開的話題，我們不僅僅要會使用一個構建工具，還要熟悉它的原理。
