在現在的前端領域中，Vite 的人氣超級之高。

自2020年4月首次亮相以來，這個項目迅速獲得了極高的關注。到目前為止，它在 GitHub 上已累積超過 64k star，每周的下載量達到了1200萬次以上。它現已被廣泛應用于多個開源框架，包括Nuxt、SvelteKit、Astro和SolidStart等。

什么是 Vite？

Vite，發音為/vit/，在法語中意為“快速”，這個名字確實很貼切。

Vite 是一款現代化的 JavaScript 構建工具，它提供針對常見 Web 模式的開箱即用支持，優化的構建過程，以及與 rollup 的靈活性和成熟度結合。此外，它還整合了 esbuild 和原生 ES 模塊，實現了一個快速的無捆綁開發服務器。

這個工具是由 Vue.js 的創始人Evan You設計的，目的是簡化捆綁過程，減少開發人員在啟動開發服務器及文件編輯后重新加載時遇到的瓶頸問題。

Vite 核心特性

當您使用 Vite 時，首先顯著的不同是開發服務器幾乎即刻啟動。通過訪問vite.new，您可以立即查看其效果。這是因為 Vite 采取了一種按需服務的方法，它并不預先捆綁所有源代碼，而是根據瀏覽器的請求實時轉換您編寫的模塊為瀏覽器能夠理解的本地 ESM 模塊。Vite 支持TypeScript、PostCSS、CSS 預處理器、JSON 和 WASM等，還能通過一個不斷增長的插件生態系統來擴展支持您喜歡的框架和工具。

在開發過程中，每當您更改項目中的文件時，Vite 利用應用程序的模塊圖僅對受影響的模塊進行熱重新加載（HMR），允許開發者實時預覽他們的更改及其對應用程序的影響。Vite 的 HMR 速度極快，它支持編輯器的自動保存功能，使得開發體驗與在瀏覽器開發工具中修改 CSS 類似

此外，Vite 在開發階段還會執行依賴預引用，使用esbuild來引用和緩存您的依賴項，這有助于加速未來服務器啟動和依賴項加載速度。特別是對于導出許多小模塊的依賴項（如 lodash），這種方式可以顯著提升加載效率，因為瀏覽器只需加載少數幾個模塊塊。它還支持在依賴項中包含CommonJS和UMD代碼，因為這些代碼會被轉換為本地 ESM 模塊。

當您準備將應用程序部署時，Vite 利用優化的 Rollup 設置進行構建。它實施 CSS 代碼分割，添加預加載指令，并優化異步塊的加載，一切無需手動配置。Vite 的 rollup 兼容插件 API 適用于開發和生產環境，便于您擴展和定制構建流程。

使用 Vite 的好處

使用 Vite 有幾個主要好處。以下是我們最喜歡的一些：

開源且獨立

Vite 是一個由開源開發者社區共同開發的獨立項目，受到來自各種背景的開發者團隊的領導。它的核心倉庫已經收到了超過900名貢獻者的貢獻，這表明它得到了積極的開發和維護。這種持續的貢獻反映了多樣化的產品需求，并且功能集也在不斷地擴展和更新。

本地開發就是快

Vite 的核心優勢之一是它的開發體驗（DX），它能確保即便是應用程序規模增大，開發者仍能享受到快速的保存和重新加載體驗。這種高效的反饋循環使得開發者可以持續高效地工作，無需擔心性能下降。

良好的生態系統支持。

Vite 同時也享受著廣泛的生態系統支持。由于其受歡迎程度，許多框架和工具都選擇默認支持 Vite 或提供一流的兼容性。這使得這些項目的維護者可以基于一個共同的平臺共享和改進工具，減少了重復工作，讓他們能專注于開發用戶所需的功能。

易于擴展

Vite 的擴展性也表現出色，得益于其對Rollup插件 API 的有效利用。這個插件系統允許開發者利用 Vite 核心的功能，并且社區中已經有許多高質量的插件可供使用，例如vite-plugin-pwa和vite-imagetools。

構建的神器

作為現代開發生態系統的重要組成部分，Vite 與其他工具如Volar、Nitro和Dev Toolkit一道，形成了一個強大的框架和工具集合。Volar 為特定編程語言如 Vue、MDX 和 Astro 提供高性能的編輯體驗，Nitro 則是一個獨立的服務器工具包，它支持各大主要部署平臺。這些工具共同構成了一個通用的框架開發基礎，為開發者提供了一個堅實的支持平臺，幫助他們構建更加復雜和功能豐富的應用。

Vite 的未來

在最近的 ViteConf 上，Evan 提到，盡管 Vite 取得了顯著的成就，但項目仍存在一些挑戰和問題。他詳細討論了 Vite 目前依賴 Rollup 來進行生產級構建的情況，并指出相比于如 esbuild 或 Bun 這樣的本地打包工具，Rollup 的速度較慢。此外，盡管 Vite 努力縮小開發環境與生產環境間的差異，但由于 Rollup 和 esbuild 之間的性能差異，某些不一致性還是難以避免

Evan 現領導的新團隊正在開發一種名為 Rolldown 的工具，這是一個基于 Rust 的 Rollup 替代品，建立在名為 OXC（JavaScript 氧化編譯器）的平臺上，目的是整合 Rollup 的靈活性和 esbuild 的高速性能。Rolldown 的設計目標是替代 Vite 中的 Rollup 和 esbuild，以此來提供統一的基礎，減少不一致性，簡化代碼的維護，并加速構建過程。雖然 Rolldown 還在初期階段，但已經展現出了潛力，并且該項目已經開源。Rolldown 團隊正在積極尋找感興趣的開發者加入他們的 GitHub 倉庫和 Discord 社區來共同推動這一項目

同時，Vite 團隊也在不斷優化和改進 Vite，這些改進從 vite-node（為 Vitest 和 Nuxt Dev SSR 提供動力的引擎）開始，并已經擴展到對 Vite API 的全面審查。預計在即將到來的 Vite v6 中將引入一個新的環境 API，這是自 Vite 2 發布以來的一次重大更新。這將允許開發者在多種環境中運行代碼，通過 Vite 插件管道實現，從而為 workerd、RSC 等提供更好的支持