用途:Markdown 在 GitHub 上难以渲染依赖图、前后架构对比、分层剖面与交互式 Mermaid 图表,本技能给出一个替代模式:生成自包含 HTML 文件,发布为 secret gist,并用 htmlpreview.github.io 构造可浏览链接。
主要能力与用法:HTML 只允许使用 CDN 脚本(Tailwind 与 Mermaid),无应用代码与额外交互,文件需能在本地直接打开并正确渲染。图可采用 Mermaid(流程图、依赖、时序)、手写 div(分层、模块深度对比)与内联 SVG(箭头连线)混用。发布流程:文件放在 docs/reports/<date>-<slug>.html,同时生成同名 .md 兜底;用 gh gist create docs/reports/<date>-<slug>.html --desc "<Report Title> — <repo-name> (<date>)" 创建 secret gist;再用 GIST_ID=$(gh gist list --limit 1 | head -1 | awk '{print $1}') 与 gh api gists/$GIST_ID --jq '.files | to_entries[0].value.raw_url' 取得 raw URL,拼接 https://htmlpreview.github.io/?$RAW_URL;最后在 PR 描述中链接可视化与 Markdown 兜底。约定合并前删除 docs/reports/ 目录,报告属于临时评审产物。
适用场景:依赖图、测试覆盖热力图、性能前后对比、迁移进度、数据流图、API 表面积可视化,以及与 improve-codebase-architecture 技能配合的架构评审。
限制:secret gist 为不公开列出但可通过 raw URL 公开访问;gh gist create 失败(认证或限流)时退回仅 Markdown 版本并提示本地打开 HTML;样式为编辑风格而非仪表盘,配色克制,图高约 320px。若开发者纠正了本应预防的行为,可提出具体修订建议。