依賴預先打包
當您第一次執行 vite 時，Vite 會在本地載入您的網站之前，預先打包您的專案依賴。預設情況下，此操作會自動且透明地完成。
原因
這是 Vite 執行我們稱之為「依賴預先打包」的過程。此過程有兩個目的：
CommonJS 和 UMD 相容性：在開發期間，Vite 的開發伺服器會將所有程式碼作為原生 ESM 提供。因此，Vite 必須先將以 CommonJS 或 UMD 形式提供的依賴轉換為 ESM。
轉換 CommonJS 依賴時，Vite 會執行智慧型匯入分析，以便對 CommonJS 模組的具名匯入也能如預期般運作，即使匯出是動態指派的（例如 React）。
js// works as expected import React, { useState } from 'react'效能：Vite 會將具有許多內部模組的 ESM 依賴轉換為單一模組，以改善後續的頁面載入效能。
某些套件會將其 ES 模組建置發佈為許多獨立檔案，彼此互相匯入。例如，
lodash-es擁有超過 600 個內部模組！當我們執行import { debounce } from 'lodash-es'時，瀏覽器會同時觸發 600 多個 HTTP 請求！即使伺服器處理它們沒有問題，大量請求也會在瀏覽器端造成網路壅塞，導致頁面載入速度明顯變慢。將
lodash-es預先打包成單一模組後，我們現在只需要一個 HTTP 請求！
注意
依賴預先打包僅適用於開發模式，並使用 esbuild 將依賴轉換為 ESM。在生產建置中，則改用 @rollup/plugin-commonjs。
自動依賴探索
如果找不到現有的快取，Vite 會爬梳您的原始碼並自動探索依賴匯入（即預期從 node_modules 解析的「裸匯入」），並使用這些找到的匯入作為預先打包的進入點。預先打包是使用 esbuild 執行的，因此通常非常快速。
伺服器啟動後，如果遇到快取中尚未存在的新依賴匯入，Vite 會重新執行依賴打包程序，並在需要時重新載入頁面。
Monorepos 和連結的依賴
在 Monorepo 設定中，依賴可能是來自相同儲存庫的連結套件。Vite 會自動偵測未從 node_modules 解析的依賴，並將連結的依賴視為原始碼。它不會嘗試打包連結的依賴，而是會分析連結的依賴的依賴清單。
但是，這需要將連結的依賴匯出為 ESM。如果不是，您可以在設定中將依賴新增至 optimizeDeps.include 和 build.commonjsOptions.include。
export default defineConfig({
optimizeDeps: {
include: ['linked-dep'],
},
build: {
commonjsOptions: {
include: [/linked-dep/, /node_modules/],
},
},
})當對連結的依賴進行變更時，請使用 --force 命令列選項重新啟動開發伺服器，以使變更生效。
自訂行為
預設的依賴探索啟發式可能並不總是理想的。如果您想要從清單中明確包含/排除依賴，請使用 optimizeDeps 設定選項。
optimizeDeps.include 或 optimizeDeps.exclude 的常見使用案例是當您有無法直接在原始碼中探索到的匯入時。例如，匯入可能是由外掛轉換產生的結果。這表示 Vite 無法在初始掃描時探索到匯入，它只能在瀏覽器請求檔案並轉換後才能探索到。這將導致伺服器在啟動後立即重新打包。
include 和 exclude 都可以用來處理這種情況。如果依賴很大（具有許多內部模組）或為 CommonJS，則您應該包含它；如果依賴很小且已經是有效的 ESM，您可以排除它並讓瀏覽器直接載入它。
您也可以使用 optimizeDeps.esbuildOptions 選項進一步自訂 esbuild。例如，新增 esbuild 外掛來處理依賴中的特殊檔案，或變更 建置 target。
快取
檔案系統快取
Vite 會將預先打包的依賴快取在 node_modules/.vite 中。它會根據以下幾個來源判斷是否需要重新執行預先打包步驟：
- 套件管理器鎖定檔內容，例如
package-lock.json、yarn.lock、pnpm-lock.yaml或bun.lockb。 - 修補程式資料夾修改時間。
- 您的
vite.config.js中的相關欄位（如果存在）。 NODE_ENV值。
只有在上述其中一項發生變更時，才需要重新執行預先打包步驟。
如果由於某些原因您想要強制 Vite 重新打包依賴，您可以透過 --force 命令列選項啟動開發伺服器，或是手動刪除 node_modules/.vite 快取目錄。
瀏覽器快取
解析的依賴請求會透過 HTTP 標頭 max-age=31536000,immutable 強烈快取，以改善開發期間的頁面重新載入效能。一旦快取，這些請求將永遠不會再次命中開發伺服器。如果安裝了不同的版本（如您的套件管理器鎖定檔中反映的），它們會由附加的版本查詢自動失效。如果您想透過進行本地編輯來偵錯您的依賴，您可以：
- 透過瀏覽器開發人員工具的網路標籤暫時停用快取；
- 使用
--force標記重新啟動 Vite 開發伺服器，以重新打包依賴； - 重新載入頁面。