review-remix-v2

Remix v2 代码审查

参数

• --parallel：在 Agent 支持子 Agent 时，提示按技术领域拆分任务（见步骤 5）。若不支持，则按顺序执行审查，输出相同。
• 路径：目标目录（默认为当前工作目录）

步骤 1：识别变更文件

git diff --name-only $(git merge-base HEAD main)..HEAD | grep -E '\.(tsx?|jsx?|mjs|cjs|css)$|^(remix|vite)\.config\.'

如果没有返回结果，请在继续前要求用户提供明确的路径列表。

步骤 2：检测 Remix v2 + 技术栈

# Detect Remix v2 in package.json (any official adapter)
grep -E '"@remix-run/(react|node|cloudflare|deno|serve)"' package.json | head -3

# Confirm app router layout
ls app/routes/ 2>/dev/null | head -5

# meta exports (route metadata)
grep -rE 'export const meta|export function meta|export let meta' app/ --include="*.tsx" --include="*.ts" -l | head -3

# Sessions / cookies / auth
grep -rE 'createCookieSessionStorage|getSession\(|commitSession\(|destroySession\(' app/ --include="*.ts" --include="*.tsx" -l | head -3

# Form primitives (forms-review)
grep -rE 'useFetcher\(|<Form|useSubmit\(|useNavigation\(' app/ --include="*.tsx" -l | head -3

# Form anti-patterns: native form / manual fetch (forms-review trigger even without Remix imports)
grep -rE '(^|[^.])<form |fetch\(' app/ --include="*.tsx" -l | head -3

# Error boundaries
grep -rE 'export function ErrorBoundary|export const ErrorBoundary|useRouteError|isRouteErrorResponse' app/ --include="*.tsx" -l | head -3

# Headers / streaming / server-only modules
grep -rE 'export const headers|export function headers|defer\(' app/ --include="*.tsx" --include="*.ts" -l | head -3
find app -type f \( -name '*.server.ts' -o -name '*.server.tsx' -o -name '*.client.ts' -o -name '*.client.tsx' \) | head -5

# Prefetch hygiene (perf-ssr-review)
grep -rE 'prefetch=|<PrefetchPageLinks' app/ --include="*.tsx" -l | head -3

# Loaders / actions (data flow)
grep -rE 'export (async )?function (loader|action)|export const (loader|action)' app/ --include="*.tsx" --include="*.ts" -l | head -3

如果 package.json 检查没有返回结果，请停止并告知用户：此技能适用于 Remix v2 项目。

步骤 3：加载验证协议

在对代码做出任何实质性判断前，加载 review-verification-protocol 技能。这是跨插件的规范协议；请勿以框架专用副本替代。

步骤 5 前的关卡： 必须已加载该技能（或其检查清单已在上下文中打开）。在通过此关卡前，不要判定严重程度或编写问题发现。

步骤 4：加载技能

阅读以下每项适用技能（打开其 SKILL.md），确保在审查相应领域前已将其指导内容纳入上下文。

务必加载（非简单的 Remix v2 应用会涉及全部六个领域）：

• remix-v2-routing-review
• remix-v2-data-flow-review
• remix-v2-forms-review
• remix-v2-error-boundaries-review
• remix-v2-perf-ssr-review
• remix-v2-meta-sessions-review

检测遥测（记录各领域审查实际会发现的问题；不影响是否加载——始终加载全部六项技能，但要在最终报告的覆盖范围部分记录匹配项/未匹配项）：

条件	技能
存在 app/routes/	remix-v2-routing-review
找到 loader / action 导出	remix-v2-data-flow-review
找到 <Form>、useFetcher、useSubmit、useNavigation、原生 <form 或手动 fetch(	remix-v2-forms-review
找到 ErrorBoundary / useRouteError	remix-v2-error-boundaries-review
找到 headers 导出、defer(、.server.ts / .client.ts 文件或 prefetch=/<PrefetchPageLinks	remix-v2-perf-ssr-review
找到 meta 导出或会话/ Cookie 辅助函数	remix-v2-meta-sessions-review

如果某一行检测没有匹配项，请在报告的覆盖范围部分明确记录这一点——仍需加载该技能，但审查者应注明该领域没有可审查的内容。

步骤 5：审查

如果 Agent 支持子 Agent（且已请求或适合使用 --parallel），则为每个领域分派一个子 Agent 并行处理；否则，在单一上下文中按顺序审查相同领域。两种方式的输出相同。

并行方式：

1. 预先检测所有领域
2. 为每个领域分派一个子 Agent，各自加载对应技能且只审查所属领域
3. 等待所有子 Agent 返回结果
4. 将发现汇总为单一输出

顺序方式：

1. 加载适用技能
2. 首先审查路由和嵌套路由结构
3. 审查 loader/action 数据流
4. 审查表单和渐进增强
5. 审查错误边界
6. 审查 meta、会话和 headers/SSR
7. 汇总发现

步骤 6：验证发现

报告任何问题前：

1. 重新阅读实际代码（而不只是差异上下文）
2. 对于“未使用”的判断——是否搜索了所有引用，包括路由文件约定？
3. 对于“缺失”的判断——是否检查了父级路由、root.tsx 或框架默认行为？
4. 对于语法问题——是否依据 Remix v2 文档核实（而非 v1 或 React Router v7）？
5. 删除仅属风格偏好、并非实际问题的发现

提升为 Critical/Major 前的关卡： 对于该问题，第 (2)–(4) 项必须有具体凭据支持，例如已打开的 FILE:LINE 文件、引用搜索的 grep 输出或所引用的父级/框架代码，而不能仅依据差异上下文。

第 7 步：审查收敛

• 单次审查： 在一次审查中报告路由、数据流、表单、错误、SSR/性能、元数据/会话、类型和安全方面的所有问题。提交前，先确认你建议的修复是否会引发新的问题；如果会，请一并指出。
• 范围： 仅审查差异中的代码及其直接相关的现有代码。缺少测试覆盖属于一个 Minor 问题，不提供实现建议。不添加新依赖。
• 修复复杂度： 对现有代码修复的严重程度按实际情况评定。要求编写全新代码（新模块、依赖、测试套件、抽取的抽象）的事项属于 Informational，不构成阻塞。
• 重新审查： 仅验证之前的修复，不要发现新问题，也不要再次标记尚未修复的 Minor/Nice-to-Have 项。

输出格式

## Review Summary
[1-2 sentence overview]

## Issues

### Critical (Blocking)
1. [FILE:LINE] ISSUE_TITLE
   - Issue / Why / Fix

### Major (Should Fix)
2. [FILE:LINE] ISSUE_TITLE
   - Issue / Why / Fix

### Minor (Nice to Have)
N. [FILE:LINE] ISSUE_TITLE
   - Issue / Why / Fix

### Informational (For Awareness)
N. [FILE:LINE] SUGGESTION_TITLE
   - Suggestion / Rationale

## Good Patterns
- [FILE:LINE] Pattern description (preserve this)

## Verdict
Ready: Yes | No | With fixes 1-N (Critical/Major only; Minor items are acceptable)
Rationale: [1-2 sentences]

修复后验证

修复完成后，运行：

npm run lint
npm run typecheck
npm run test

所有检查都必须通过，方可批准。

门槛

按顺序逐项推进；不得通过非正式地重述来跳过任何通过条件。

1. 已记录范围 — 通过条件： 你已获得第 1 步命令的输出（或明确的替代路径列表），其中列出了审查范围。
2. 已加载协议和始终适用的技能 — 通过条件： 在首次评定严重程度前，已加载 review-verification-protocol 和全部六个 remix-v2-*-review 技能。
3. 已审查条件技能 — 通过条件： 对于第 2 步中的每条检测项，你都已确认匹配，或记录命令未返回任何结果。
4. Critical/Major 证据 — 通过条件： 每项此类问题都引用了树中存在的 FILE:LINE，并符合该问题类型在第 6 步中的通过规则。
5. 单一输出 — 通过条件： Issues 部分使用连续编号，且交付内容满足第 7 步的单次审查完整性要求。

规则

• 审查前加载技能，不要事后加载。
• 为每个问题按顺序编号，并注明 FILE:LINE 以及清晰的 Issue / Why / Fix。
• 这是 Remix v2——不要套用 React Router v7、Remix v1 或 Next.js（"use client"、服务器组件）的约定。
• 修复后运行“修复后验证”区块；Verdict 不考虑 Minor 和 Informational 项。