fix: 发版后懒加载 chunk 失效白屏——ErrorBoundary 自动刷新 + lazy 重试 #1732
Merged
auto-approve-bot
merged 2 commits from 2026-09-06 13:35:39 +08:00
fix/chunk-load-white-screen into develop
2 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 xiaoxia
|
320aa89751 |
fix: 按 AI Review 意见加固——非chunk错误跳首页防死循环 + storage异常防护
CI/CD Pipeline / Check push changed paths (pull_request) Has been skipped
CI/CD Pipeline / Dedup Check - skip PR tests when covered by push pipeline (pull_request) Successful in 2s
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 2s
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / PR Build API Image (pull_request) Has been skipped
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Retag skipped Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Retag skipped Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Retag skipped Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
CI/CD Pipeline / Validate - Python (mypy + alembic) (pull_request) Successful in 1m43s
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m48s
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 2m3s
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 2m4s
CI/CD Pipeline / Frontend Unit Tests (pull_request) Successful in 2m3s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 2m14s
CI/CD Pipeline / Validate - Style (pull_request) Successful in 2m31s
CI/CD Pipeline / Validate - Security (pull_request) Successful in 4m58s
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
CI/CD Pipeline / CI Gate (pull_request) Successful in 3s
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
AI Code Review / AI Code Review (pull_request) Failing after 5m59s
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 4m7s
ACR Cleanup / ACR Image Cleanup (pull_request_target) Successful in 18s
Preview Cleanup / Cleanup Preview Environment (pull_request) Successful in 36s
CI/CD Pipeline / ACR Image Cleanup (pull_request) Failing after 10m13s
CI/CD Pipeline / Staging API Integration Tests (pull_request) Failing after 10m15s
CI/CD Pipeline / Staging E2E Tests (pull_request) Failing after 10m21s
CI/CD Pipeline / Canary Release to Production (pull_request) Has been skipped
- 手动兜底由 hardReload(刷新当前URL) 改为 goHomeRecover(跳首页整页导航)： chunk 失效时脱离旧 chunk 引用；业务崩溃时绕开报错路由，避免刷新-再崩死循环 - chunkLoadError 的 sessionStorage 访问全部包 try-catch（Safari 无痕/禁用 Cookie 时访问存储会抛异常，错误边界本身不能因此崩溃），降级为无标记 - lazyRoute 增加 mod.default 校验，缺导出时抛明确错误 |
||
|
xiaoxia
|
c894163446 |
fix: 发版后懒加载 chunk 失效白屏——ErrorBoundary 自动刷新 + lazy 重试
CI/CD Pipeline / Check push changed paths (pull_request) Has been skipped
CI/CD Pipeline / Dedup Check - skip PR tests when covered by push pipeline (pull_request) Successful in 2s
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 2s
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / PR Build API Image (pull_request) Has been skipped
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Retag skipped Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Retag skipped Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Retag skipped Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
CI/CD Pipeline / Validate - Python (mypy + alembic) (pull_request) Successful in 1m43s
AI Code Review / AI Code Review (pull_request) Failing after 1m49s
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m46s
CI/CD Pipeline / Frontend Unit Tests (pull_request) Successful in 1m58s
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 2m1s
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 2m7s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 2m8s
CI/CD Pipeline / Validate - Style (pull_request) Successful in 2m27s
CI/CD Pipeline / Validate - Security (pull_request) Successful in 4m23s
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
CI/CD Pipeline / Canary Release to Production (pull_request) Has been skipped
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
CI/CD Pipeline / CI Gate (pull_request) Successful in 3s
PR Automation / Auto Merge on CI Green + Approved (pull_request) Has been cancelled
根因：所有页面 React Router lazy 动态 import，发版后旧 chunk 文件名删除， 停留旧标签页的用户点菜单时 import 404（Failed to fetch dynamically imported module / ChunkLoadError），无兜底导致整页白屏。 改动： - utils/chunkLoadError.ts：识别 chunk 加载错误（Vite/webpack/字符串多形态）； sessionStorage 标记最近 10min 内是否已为 chunk 失效自动刷新过（防死循环） - components/common/ChunkErrorBoundary.tsx：全局错误边界包裹 RouterProvider； chunk 错误首次捕获自动整页刷新（刷新后 no-cache 的 index.html 拿到新 chunk 引用自愈），已刷新过仍失败则显示「系统已更新，请点击刷新」兜底按钮； 其他错误显示通用异常页，不再整页白屏 - router/lazyRoute.ts：路由 lazy 包一层自动重试（最多 2 次，300/800ms）， 网络抖动无感恢复；chunk 404 重试耗尽抛出交给 Boundary；非 chunk 错误立即抛 - appRoutes.tsx：28 个路由 lazy 统一替换为 lazyRoute - nginx 缓存策略经核实已满足要求：index.html no-cache、/assets/* immutable 1y 单测 16 例：chunk 错误识别多形态、reload 标记生命周期、Boundary 首次自动刷新/ 二次手动兜底/非 chunk 通用页、lazyRoute 重试成功/耗尽抛出/非 chunk 不重试。 |