SuperAPI AI 工具集

remix-v2-error-boundaries-review

编程与开发

查看项目

更新于 10-16 14:56

技能介绍

用途

该技能是一个代码审查规则集,目标是对 Remix v2 路线模块中的错误处理代码进行审查。它适用于导入自 @remix-run/* 的 TypeScript 路线模块,围绕 Remix v2 统一后的 ErrorBoundary 模型给出检查项、参考文档、严重级别与报告前置门槛。资料说明该主题没有同类的兄弟知识技能,其规范心智模型在正文中内联概述,并在 references/ 目录下展开。

主要能力

审查覆盖以下方面:

  • 边界形态:检查是否声明 export function ErrorBoundary() 且无 props;是否通过 useRouteError() 而非 useCatch() 或 props 读取错误;收窄顺序是否先 isRouteErrorResponse(error)、再 error instanceof Error、最后兜底;error.data 是否被防御性渲染;能抛错的路由是否导出自己的 ErrorBoundary;根 app/root.tsx 是否导出渲染 <Meta />、<Links />、<Scripts /> 的 ErrorBoundary;根边界读取根数据时是否使用 useRouteLoaderData("root") 而非 useLoaderData()。
  • 抛出与返回:检查 loader/action 中的 4xx/5xx 是否使用 throw(而非 return)抛出 Response / json;是否吞掉 error.data;是否抛出字符串;是否缺少 handleError。
  • 根边界脚手架:检查缺失根边界、根边界缺少 <Meta />/<Links />/<Scripts />、在根边界中使用 useLoaderData() 等情况。
  • v1 遗留识别:检查 CatchBoundary 导出、useCatch 导入、future.v2_errorBoundary 标志。

资料同时列出明确不应报告为问题的正确用法(Do NOT Flag),例如故意从父级边界继承而省略 ErrorBoundary、使用 throw new Response(...) 或 throw json(...) 表达 404/401/403、仅用 isRouteErrorResponse 收窄(至多为建议级)、静态兜底边界不调用 useRouteError()、根边界 useRouteLoaderData("root") 返回 undefined 的防御式处理、handleError 在 request.signal.aborted 时提前返回、handleError 不处理抛出的 Response、嵌套边界返回不带 <html>/<body> 的片段等。

严重级别默认值

资料给出默认严重级别:v2 代码库中出现 CatchBoundary 导出或 useCatch 导入为 BLOCKER;根 ErrorBoundary 缺少 <Scripts /> 为 BLOCKER;使用 ({ error }) v1 props 签名的 ErrorBoundary 为 WARN;用 return json(...) 返回 4xx 而非 throw 为 WARN;存在渲染崩溃风险的路由缺少 instanceof Error 分支为 WARN;仅抛 Response 的路由缺少 instanceof Error 分支为 ADVISORY;根边界使用 useLoaderData() 为 WARN;entry.server.tsx 缺少 handleError 为 ADVISORY。

使用方式

资料规定报告前需按顺序通过四项硬性门槛:位置证据(列出仓库路径与行范围或原文引用)、豁免检查(说明为何不属于不报告模式)、v1 与 v2 标记检查(grep CatchBoundary、useCatch、v2_errorBoundary、ErrorBoundary({ error 等标记)、协议检查(完成 review-verification-protocol 中的预报告验证清单)。此外提供审查问题清单与四份参考文档入口:boundary-shape.md、throw-response.md、root-boundary.md、v1-holdovers.md。

适用场景与限制

该技能面向 Remix v2 项目的代码审查,尤其是错误边界评审工作流。其规范心智模型要点包括:v2 将 v1 的 CatchBoundary 与 ErrorBoundary 统一为单一 ErrorBoundary 路由模块导出,框架对抛出的 Response 与抛出的运行时错误都会调用它;边界不接收 props;错误渲染最近的 ErrorBoundary,若无则冒泡至根,根边界会重新挂载整个文档;只有抛出的 loader/action 结果会到达边界,带 4xx 状态的 return json(...) 属于成功 loader 而非错误;服务端运行时错误还会流经可选的 entry.server.tsx handleError 导出,而抛出的 Response 不会。资料未提供该技能的安装命令、价格、收费、平台或效果信息。

参考资料

Remix v2 ErrorBoundary 文档:https://remix.run/docs/en/main/route/error-boundary Remix v2 错误处理指南:https://remix.run/docs/en/main/guides/errors Remix v2 entry.server / handleError 文档:https://remix.run/docs/en/main/file-conventions/entry.server