@void/react: client environment has no optimizeDeps.entries for pages, causing a dev re-optimization reload on first load
維護者通常 1 天內回覆
評估
- 難度
- 3/5
- 預估耗時
- 1-2 天
- 新手友好度
- 66/100
- Issue 類型
- 缺陷
- 描述清晰度
- 描述清楚
- 活躍度
- 活躍
- 技術堆疊
- typescript, vite
- 領域
- build-system, devtools
研究方向
Start with react/src/plugin-pages.ts around lines 190–218 and 274, then trace how the dev config sets optimizeDeps for the client and worker environments. Reproduce with a cold node_modules/.vite cache and DEBUG=vite:deps vp dev; the issue includes a workaround and measurements. Done when page dependencies and void/pages-prefetch are optimized on the first load without a client reload.
由索引模型根據 Issue 內容生成。
描述
Summary
In dev, @void/react gives the worker environment a pages/** scan entry but gives the client environment none. Vite's client scanner therefore finds no dependencies, discovers them while serving the first page, re-bundles, and forces a full page reload ((client) optimized dependencies changed. reloading).
- Version:
void/@void/react1.2.1 (latest).mainat 65ab6032 has the same code. packages/react/src/plugin-pages.ts#L190-L218: the client env only getsinclude: CLIENT_OPTIMIZE_DEPS(React);entries: [pagesOptimizeEntries]is set only underenvironments[WORKER_ENVIRONMENT_NAME](L214).- The worker entry was added in ba979d5c ("Fix worker crash in dev on initial load"); its comment explains the worker case only. Nothing in the docs mentions
optimizeDeps. - A second, related gap: the generated client entry imports
void/pages-prefetch(L274). It is a virtual module, so the scanner can't see that import either, andvoid/pages-prefetchis discovered late even when page entries are scanned.
Repro
- A Pages app with a few page components that import third-party UI packages (e.g.
@base-ui/react/*,@tanstack/react-query). rm -rf node_modules/.vite && DEBUG=vite:deps vp dev- Open a page in the browser.
Observed (DEBUG=vite:deps):
(client) Scan completed in 12.74ms: no dependencies found
new dependencies were found while crawling that weren't detected by the scanner
new dependencies found: void/pages-prefetch, @base-ui/react/merge-props, ..., motion/react
(client) optimized dependencies changed. reloading
Measurements (one app, headless Chromium, cold node_modules/.vite, 3 runs per row, numbers summed over the whole load including the reload)
| client config | requests | JS modules | client reload | median time to hydration |
|---|---|---|---|---|
| as shipped | 238 / 231 | 233 / 226 | yes (3/3) | 3981 / 4207 ms |
+ entries only |
239 / 233 | 234 / 228 | yes (3/3, only void/pages-prefetch late) |
4048 / 4091 ms |
+ entries + include: ['void/pages-prefetch'] |
217 / 211 | 214 / 208 | no (0/3) | 3453 / 3180 ms |
(two routes per cell)
Workaround
// vite.config.ts
export default defineConfig({
optimizeDeps: {
entries: ['pages/**/*.{js,jsx,ts,tsx}', '!pages/**/*.server.{js,jsx,ts,tsx}'],
include: ['void/pages-prefetch'],
},
// ...
});
Suggested fix
In the dev config hook of plugin-pages.ts, also pass the page entries (excluding *.server.* companions) to the client optimizeDeps.entries, and add void/pages-prefetch to the client include (it is imported only by the virtual client entry).
- 主要語言
- TypeScript
- 星號
- 580
- 分支
- 56
- 平均合併
- 11 小時 32 分鐘
- 30 天內合併 PR
- 158
環境準備
這個專案沒有提供開發容器、Dockerfile 或貢獻指南,環境需要你自己搭建:先看它的 README,通用步驟見我們的新手貢獻指南。
從這裡開始
- 先讀完整個 Issue,再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫,在一個分支上完成修改。
- 送出 Pull Request,並在描述裡引用這個 Issue 編號。
voidzero-dev/void 的其他 Issue
-
難度 5/5 一週以上 新手友好度 42/100
voidzero-dev/void#638 ·
維護者通常 1 天內回覆
-
難度 3/5 1-2 天 新手友好度 57/100
voidzero-dev/void#636 ·
維護者通常 1 天內回覆
-
難度 3/5 1-2 天 新手友好度 67/100
voidzero-dev/void#635 ·
維護者通常 1 天內回覆
-
難度 4/5 3-5 天 新手友好度 48/100
voidzero-dev/void#627 ·
維護者通常 1 天內回覆
-
難度 4/5 3-5 天 新手友好度 48/100
voidzero-dev/void#619 ·
維護者通常 1 天內回覆
查看 voidzero-dev/void 的全部 Issue
相似的 Issue
-
Parallel reticle_verify opens per-flow leases without the source lease's ignoreHTTPSErrors可能已有人在做 @as992949791 今天認領。 未關閉good first issue help wanted
難度 2/5 1-3 小時 新手友好度 85/100
reticlehq/reticle#2033 · 1 則留言 ·
維護者通常 1 天內回覆
-
難度 2/5 1-3 小時 新手友好度 78/100
維護者通常 1 天內回覆
-
area:quality p3-medium ready-for-agent type:docs
難度 2/5 1-3 小時 新手友好度 83/100
fderuiter/deruiter.dev#3589 · 1 則留言 ·
維護者通常 1 天內回覆
-
難度 2/5 1-3 小時 新手友好度 75/100
manfredsteyer/angular-oauth2-oidc#1514 ·
-
難度 2/5 1-3 小時 新手友好度 76/100
marmelab/react-admin#11431 ·
維護者通常 1 天內回覆