Use when creating or editing ASCII art box-drawing diagrams in markdown code fences that contain CJK characters (Chinese, Japanese, Korean). Triggers on misaligned boxes, mixed CJK/ASCII content lines, or when writing new box-drawing diagrams with non-ASCII text. Also use when user reports alignment issues in terminal display of markdown files.
display_width(字符串) = 各字符宽度之和
- east_asian_width(c) ∈ {F, W} → 2 列 (汉字, 全角标点)
- 其余字符 → 1 列 (ASCII, box-drawing, 半角标点)
方框内所有行 (从 ┌ 到 └) 的 display width 必须相同。
| 字符 | 宽度 | 类别 |
|---|---|---|
a-z A-Z 0-9 |
| 1 |
| ASCII |
│┌└├─┐┘┤┬┴═ | 1 | Box-drawing |
←→↑↓▼▲ | 1 | 箭头 |
| 空格 | 1 | 空白 |
中文汉字 | 每字 2 | CJK 表意文字 |
（）：，、。「」 | 每字 2 | 全角标点 |
(),:."" | 每字 1 | 半角标点 |
方框内优先用半角标点减少宽度计算失误:
() 不用 （）: 不用 ：, 不用 ，写完后用脚本检测:
python3 ~/.codex/skills/writing-markdown/check_alignment.py <file.md>
A → B → C多于 2 个参与方的交互? → mermaid sequenceDiagram
有条件分支或循环? → mermaid flowchart
是状态转换? → mermaid stateDiagram-v2
只是线性展示结构/布局/调用链? → ASCII art
markdown 写完后执行:
prettier --write <file.md>
prettier 不会改动代码块内部, 所以 ASCII art 对齐仍需手动保证。
1. 写 markdown 正文
2. 选择图表类型 (ASCII art or mermaid)
3. 若有 ASCII art 方框:
3a. 方框内用半角标点
3b. 运行 check_alignment.py 验证对齐
3c. 修复不对齐的行
4. prettier --write <file.md>