用途
render-incident-report-image 是一个用于把冗长的等宽字体“事件报告”渲染成 PNG 图片的技能,输出针对在 iPhone 13 mini 上通过 Pushover 通知阅读进行调优:72 列换行、深色主题、绿色标题。
主要能力
- 通过 TS 核心 pushover_core.ts 的 render 命令渲染干净的等宽报告 PNG,管线为 Satori → 矢量 SVG → @resvg/resvg-js → PNG。
- 设备校准事实(在实体 iPhone 13 mini 上验证,2026-05-30):
- 72 列硬换行无需双指缩放即可舒适阅读(40/56/72 均测试过,72 确认可用)。
- Pushover 会按宽度适配图片,从不水平裁剪。此前“右边缘被裁”的图片是渲染器缺陷(未换行),而非 Pushover 所致。
- 没有实际的像素高度上限:30,000 px 高的图片滚动/缩放正常,远低于 5 MB 附件上限,因此整份报告渲染为一张高图,绝不翻页。
- 自适应宽度(2026-06-01):72 列是最大换行宽度,而非固定画布宽度。画布按最长实际行调整尺寸(maxChars × 18px 步进 + 48px 内边距,等宽字体 ⇒ 精确/确定),因此短报告不会浪费右侧空白,Pushover 会将紧凑图片放大,使文字显示更大(例如 43 字符摘要:1344 → 822 px,屏幕上约放大 1.6 倍)。无需图片后处理。
使用方式
env -u HTTPS_PROXY -u HTTP_PROXY bun "$(cc-plugin-root pushover-commander)/skills/_lib/pushover_core.ts" render \
--in report.txt --out /tmp/report.png # or: cat report.txt | bun .../pushover_core.ts render --out /tmp/report.png
# then attach with send-notification --attach /tmp/report.png
行标记(前 2 个字符):
| 前缀 | 样式 |
|---|---|
| # | 标题(绿色) |
| ! | 副标题(琥珀色) |
| > | 强调(青色) |
| . | 暗淡/弱化 |
| (无) | 正文(浅灰色) |
换行是词感知的(贪心,fold -s 语义):在空格处断行,绝不在词中间断开。只有单个 token 本身超过列宽(路径、哈希、URL)才会硬断,以免溢出画布。已在宽度内的行保持其精确间距(对齐的表格保持对齐)。贪心是左对齐等宽文本的正确算法——Knuth-Plass 优化的是两端对齐段落,对右参差固定宽度文本没有增益。
适用场景
适用于需要将冗长的事件报告以图片形式通过 Pushover 通知发送、并在小屏手机上阅读的场景。
限制
- 该技能为自进化技能:通过使用改进。如果说明有误、参数漂移或需要变通方法,应立即修复此文件,不要推迟。仅针对真实、可复现的问题更新。
- 执行后反思:技能完成后,关闭前检查:PNG 是否以正确的词换行渲染、在目标设备宽度下没有水平截断?如果文本溢出,修复换行/宽度。Satori 到 resvg 管线是否无错误完成?空白或部分图片意味着渲染回归需要修复。仅在问题真实且可复现时更新——不要凭猜测。