- 修复 build script 引用已删除的 registerCheckers,恢复生产构建 - 生产入口添加 SIGINT/SIGTERM 优雅关闭(与 dev.ts 一致) - 新增 runtime.retention 配置(默认 7d),ProbeStore.prune() 定时清理过期数据 - parseDuration 扩展支持 h/d 单位 - 新增前端 ErrorBoundary 组件,防止渲染错误白屏 - Vite codeSplitting.groups 拆分 vendor chunks(业务代码 1180KB → 47KB) - 同步 delta specs 到主规范
1.3 KiB
1.3 KiB
Purpose
定义前端全局错误边界:捕获渲染错误防止白屏,展示友好的错误兜底 UI。
Requirements
Requirement: 全局渲染错误捕获
前端应用 SHALL 在最外层包裹 ErrorBoundary 组件,捕获所有子组件树的渲染错误,防止白屏。
Scenario: 子组件渲染抛出异常
- WHEN 任意子组件在渲染过程中抛出 JavaScript 异常
- THEN ErrorBoundary SHALL 捕获该异常,展示错误兜底 UI,而非白屏
Scenario: 错误兜底 UI 内容
- WHEN ErrorBoundary 捕获到渲染错误
- THEN 系统 SHALL 使用 TDesign Result 组件(type="500")展示错误提示,并提供"刷新页面"按钮
Scenario: 刷新页面恢复
- WHEN 用户点击错误兜底 UI 中的"刷新页面"按钮
- THEN 系统 SHALL 调用
window.location.reload()重新加载页面
Scenario: 错误信息记录
- WHEN ErrorBoundary 捕获到渲染错误
- THEN 系统 SHALL 通过
console.error输出错误信息和组件堆栈
Requirement: ErrorBoundary 包裹位置
ErrorBoundary SHALL 包裹在 QueryClientProvider 外层,确保 React Query 相关的渲染错误也能被捕获。
Scenario: 包裹层级
- WHEN 应用渲染树构建
- THEN 层级 SHALL 为 StrictMode > ErrorBoundary > QueryClientProvider > App