可读性代码风格审查
把「能跑但不优雅」的分支结构改成一眼能扫读的代码。默认只报告;用户确认后再改。
改写示例与 before/after 见 references/patterns.md。遇到嵌套三元、条件 className、多分支 placeholder/label 时先读该文件。
src/app/api/**/route.ts 的 handler 格式(有序守卫、JSDoc、early return)走 api-route-readability。
工作流
- 审查(默认):扫描目标文件/选区,按下方规则出 findings。不改文件。
- 等确认:用户说「改吧」「按建议改」等明确同意后,再进入重构。
- 重构:按 findings 最小 diff 落地;只动可读性,不顺手改行为、不引入新依赖。
- 收尾:简述改了哪些点;若某处刻意保留(如单层三元更清晰),说明原因。
本仓库惯例
- 正例:
src/features/dev/WechatConversationPage.tsx中statusChip用Record做状态→样式/文案映射——同类映射优先对齐这种写法。 cx:antd-style / CSS modules 文件沿用已有cx,扁平布尔组合(cx(base, cond && variant))。- Tailwind 模板字符串:优先映射表或小 helper;不要为了「用上 cn」新建工具函数。仅当文件/包已有
cn/clsx/cx时推荐用它们组合 className。
规则优先级
P0 — 必查
| 模式 | 判定 | 首选改写 |
|---|---|---|
嵌套三元(≥2 层 ? :) |
文案、枚举、状态映射 | Record / lookup + fallback |
| 多分支 UI 文案 | placeholder、label、权限文案 | 小函数 + early return,或 lookup |
| 条件 className 嵌套三元 | 多状态 × active 等 | getXxxClass(...)、二维 lookup;已有 cx/cn 则扁平布尔 |
P1 — 建议查
| 模式 | 首选改写 |
|---|---|
| 过长内联 JSX 表达式 | 提取命名变量 / 子组件 / helper |
| 深层逻辑塞在 JSX 属性里 | 渲染前算好再传入 |
| 可 early return 仍用大 if/else 或三元 | 扁平守卫 return |
&& 与三元混用难扫读 |
统一成一种清晰结构 |
明确不做
- 纯偏好(引号风格、无关命名争论)
- 与业务无关的大重构
- 为用上
cn而新增尚未存在的工具函数
审查输出模板
## 可读性审查
### 摘要
- N 处建议处理(P0: x / P1: y)
### Findings
1. **[P0] 嵌套三元 → 映射表** — `path:line`
- 现状:简述
- 建议:给出 5–15 行目标代码片段
2. ...
### 下一步
确认后我可以按上述建议直接改文件(最小 diff)。
重构约束
- 保持行为不变(文案、样式、条件语义一致)。
- 优先复用文件内已有模式(如已有
Recordmap,新映射用同结构)。 - 单层、两侧都很短的三元可以保留(如
active ? 'a' : 'b')。 - 提取的 helper 放在同文件合适位置;仅当多处复用且适合共享时再上提。