Answer me with HTML
把复杂问题整理成可阅读、可离线查看的一页 HTML。
- Star 数
- ★ 2k
- 最近更新
- 今天
- License
- MIT
- 主语言
- JavaScript
- FA 评分
- 61/100 · 存在缺口
30 秒速览
- 运行形态
- 可在哪里用
- 通用 · 跨平台Codex · Claude Code
- 费用
- 软件免费，模型调用费用自付
- 上手难度
- 低 · 几分钟可跑通
- 开始前需要
- 典型场景
- 需要理解 TCP 握手的开发者，可生成包含时序图、状态图和标志表的说明页。
- 不适合
- 只需要简短纯文本回答的用户
- 源码审查
- 61/100 · 存在缺口
这个 Agent 能做什么，适合哪些场景？
这是一个供 Claude Code、Codex、Cursor、OpenCode、Pi 等编码助手使用的 skill，也附带可在终端运行的 `am` CLI。助手先写 Markdown 草稿，再由 CLI 将其渲染为包含文本、表格、代码和图表的单页 HTML。内置 flow、sequence、tree、timeline 等组件，并提供 blueprint、shadcn 和 paper 主题。生成的每个页面都是独立 HTML 文件，可离线打开，Markdown 源文也嵌入页面。使用需要 Node.js 20 或更新版本；README 未要求 API 密钥，也未说明模型调用费用。
安装 skill 后，用户可要求助手解释概念、梳理代码模块或比较选项；助手判断问题是否适合页面，生成 Markdown 草稿并调用 am CLI。CLI 解析草稿中的 frontmatter、组件和代码块，计算面板与图表布局，应用主题并输出单个 HTML 文件，默认保存到 ~/.answer-me-with-html/pages/。代码块可通过 src= 和 lines= 引用项目文件中的实际代码；CLI 会拒绝读取目录外文件和存放密钥的文件。可用 am video 将带旁白节拍的草稿生成视频播放器页面，并可添加 --mp4 输出视频文件。
- 需要理解 TCP 握手的开发者，可生成包含时序图、状态图和标志表的说明页。
- 接手陌生代码库的工程师，可用目录树和调用关系图查看模块组织。
- 需要选择 Redis 或 Memcached 的团队，可用对比表整理差异并查看结论。
- 准备缓存改造计划的开发者，可在页面中查看真实代码和待决选项。
- 制作技术讲解材料的用户，可要求生成带逐步图示和旁白的视频页面。
如何安装或部署这个 Agent？
需要 Node.js 20 或更新版本；安装 skill 不需要单独运行 npm install。README 推荐用支持的助手按 INSTALL.md 执行安装，也记录了通用 skills 安装命令和 Claude Code 插件安装命令。通用安装器会询问要安装到哪些助手；Claude Code 插件方式需在 Claude Code 中运行以下命令。
npx skills add QingYunA/answer-me-with-html/plugin marketplace add QingYunA/answer-me-with-html
/plugin install answer-me-with-html@answer-me-with-html也可手动复制 skills/answer-me-with-html 到助手的 skill 目录；Claude Code 示例：
git clone --depth 1 https://github.com/QingYunA/answer-me-with-html.git /tmp/answer-me-with-html
cp -R /tmp/answer-me-with-html/skills/answer-me-with-html ~/.claude/skills/answer-me-with-html如何使用这个 Agent？
安装后，在助手对话中提出需要解释的问题；例如：
解释 TCP 三次握手也可直接要求 HTML 页面，或在终端使用 CLI。可通过 CLI 查看、修改或重置设置：
am config
am config set open off
am config reset页面默认保存在 ~/.answer-me-with-html/pages/。要生成讲解视频，可要求助手制作视频，例如：
make a 3b1b-style video on the TCP handshakeREADME 说明 CLI 要求 Node.js 20 或更新版本；视频可用 am video 渲染，也可添加 --mp4 输出视频文件。
这个 Agent 有哪些优点和局限？
- 助手只写 Markdown 草稿；README 的基准测试称，相同问题的输出 token 平均约为手写 HTML 的八分之一。
- CLI 计算面板和图表布局，提供 flow、sequence、tree、timeline 等组件。
- 生成单文件 HTML，不依赖 CDN 或网页字体，可离线打开并分享。
- 页面保留生成它的 Markdown 源文，并支持页面内评论和选项回复。
- 明确支持 Claude Code、Codex、Cursor、OpenCode 和 Pi 等多个助手。
- 需要在本地安装 Node.js 20 或更新版本，并让助手能够运行 shell 命令、访问文件。
- 需要先安装 skill 或 Claude Code 插件；它不是独立的托管问答服务。
- README 未说明模型/API 费用或模型供应商，因此总使用成本需按所用助手的服务确定。
- 自动写作检查基于 ASD-STE100 规则，只覆盖文档列出的机器可检查项目；默认仅警告。
这个 Agent 与同类方案有什么区别？
README 将本项目与 Archify 和 dsh-genui 一类 GenUI 插件作比较：Archify 从 JSON 规格生成交互图表，GenUI 插件在单个聊天应用中展示组件；本项目则把 Markdown 草稿渲染为包含文本、表格、代码和图表的整页 HTML，并通过可运行 shell 命令的助手使用。
与相关度最高的同类 agent 并排比较关键指标。
| Agent | 源码审查 | 形态 / 费用 | Star | 最近更新 | 主语言 | 完整支持的平台 |
|---|---|---|---|---|---|---|
| Answer me with HTML 当前 | 61 · 存在缺口 | Agent 插件 / 技能免费 + 模型费 | ★ 2k | 今天 | JavaScript | Codex · Claude Code |
| Markdown Viewer Agent Skills | 39 · 缺口较多 | Agent 插件 / 技能免费 | ★ 3.4k | 2 天前 | JavaScript | Codex · Claude Code |
| Ori Mnemos | 80 · 表现良好 | 命令行工具免费 | ★ 331 | 6 天前 | TypeScript | Claude Code · OpenAI API · Claude API |
| Excalidraw MCP 服务器与 CLI | 59 · 缺口较多 | 命令行工具免费 | ★ 2.5k | 29 天前 | TypeScript | ChatGPT · Codex · Claude Code · Claude.ai |
FollowAgents 如何评估这个 Agent？
查看各维度的扣分理由
README 描述本地 CLI、离线单文件输出，并称引用源文件时会拒绝文件夹外路径及保存密钥的文件；这些设计支持最小权限和敏感数据保护，但本次提供的材料没有 CLI 源码来核实实现。README 说清理页面前会询问、更新检查不发送用户信息，但安装指引称无需询问，且默认可打开浏览器；因此确认和外部影响仅部分充分。依赖被打包，但没有依赖审计或漏洞处理证据。页面可复制生成它的 Markdown，来源归属仍缺少对答案事实来源的通用说明。
README、package.json、CI 配置和测试对 Node 20+、打包 CLI、渲染示例及安装检查的描述基本一致；依赖数量有限且随 CLI 打包，普通使用的可用性有一定支撑。README 声称草稿错误会返回行号、组件和修正示例，支持可理解的失败反馈；但本次未提供对应实现，不能据此给满分。
README 覆盖解释、架构、比较、审阅和计划等场景，并说明简单问题可以不生成页面；技能也支持用户明确要求 HTML。它列出组件用途、视频需用户请求、语言和主题选项以及 Node 要求，边界和环境适配说明较清楚，但跨代理兼容性主要是文档声明，缺少本次材料中的逐环境实现证据。
README 组织清晰，提供安装方式、示例、设置、参考文档入口和开发指引；MIT 许可证文本完整，版本号也出现在 package.json。扣分原因是本次材料没有变更日志或明确维护负责人，已知限制说明较少；命名一致性及示例覆盖虽较好，但不足以证明所有场景都稳定或齐备。
产品把 Markdown 草稿转换为带布局、图表和样式的可读 HTML，并提供注释、决策回复及源码复制功能，输出用途具体。README 给出令牌和耗时对比及基准文件入口，支持其边际价值主张；但样本规模较小，节省账单较少，数据主要由项目自身报告，因此成本收益评为部分支持。
README 将部分性能数字关联到仓库基准数据，并指向示例、参考和比较文档；CI 配置及测试文件也对打包和若干功能提供交叉佐证。扣分原因是性能结论主要来自项目自身的有限测试，许多安全和体验主张在本次材料中只有 README 声明，且事实与推断的标注并不系统。
- 安装指引提到会读取远程 INSTALL.md，常规安装会调用安装器；请先确认所用代理和安装方式符合本地策略。
- 性能比较来自项目报告的小样本，且节省的账单比例低于令牌减少比例；不宜据此直接推断其他模型或任务的收益。
常见问题
需要付费 API 密钥吗？
生成的页面需要联网吗？
助手能引用项目中的真实代码吗？
src= 和 lines= 引用文件内容；目录外文件和存放密钥的文件会被拒绝。每个问题都会生成页面吗？
能生成视频吗？
am video 可把带逐段旁白的草稿转换为播放器页面，并可用 --mp4 输出视频文件。