MD → HTML 交互式报告工具

一个轻量级的 MD → HTML 交互式网页生成器，支持评论、回复和 commit 功能。

✨ 特性

• 📝 Agent 只需写 MD：不需要写任何代码
• 🔄 自动转换：render.py 自动生成带交互功能的 HTML
• 💬 评论功能：用户可以对折叠块做评论
• ↩️ 回复功能：支持短回复和长回复
• 📁 自动归档：报告自动保存到 archive/ 目录
• 📋 一键 Commit：生成格式化报告并复制到剪贴板
• 🎨 颜色区分：用户和 Agent 的评论用不同颜色区分

🚀 快速开始

1. 安装

无需安装，直接使用：

git clone https://github.com/your-username/md-to-html.git
cd md-to-html

2. Agent 输出 MD

Agent 将内容保存为 .md 文件：

# 报告标题

内容...

<details id="block-001">
<summary>📊 核心指标</summary>

内容...

</details>

3. 转换为 HTML

python render.py content.md

这会：

1. 将 MD 转换为带交互功能的 HTML
2. 自动保存到 archive/ 目录
3. 打开浏览器显示报告

4. 用户交互

1. 展开折叠块查看详情
2. 点击「💬 评论」按钮写评论
3. 点击「💬 回复」按钮回复（短回复/长回复）
4. 点击「✅ Commit」生成反馈报告
5. 将报告粘贴给 Agent

📖 使用说明

详见 USAGE.md（面向 Agent 的使用规范）。

📁 项目结构

md-to-html/
├── README.md             # 本文件
├── USAGE.md              # Agent 使用规范
├── render.py             # 核心脚本（MD → HTML）
├── md2html.py            # MD 解析器
├── index.py              # 索引页面生成器
├── interactive.html      # 通用 MD 编辑器
├── setup.py              # Windows 文件关联设置
├── archive/              # 报告归档目录
└── examples/             # 示例文件

🔧 命令行参数

render.py

python render.py input.md              # 转换并打开
python render.py input.md -n           # 只转换不打开
python render.py input.md -o out.html  # 指定输出文件名
python render.py input.md --no-archive # 不保存到 archive/
python render.py --static input.md     # 生成静态 HTML
python render.py -c                    # 从剪贴板读取

index.py

python index.py              # 生成索引页面
python index.py -o out.html  # 指定输出文件名

💬 回复功能

回复类型

类型	显示方式	用途
短回复	直接在评论下方显示	简单确认、状态更新
长回复	显示链接，点击跳转新报告	详细分析、迭代内容

工作流

用户评论 → Agent 回复（短/长） → 用户查看 → 继续交互

📊 Token 节省

• 直接输出 HTML：~500 tokens
• 输出 MD + 脚本转换：~250 tokens + 0 token
• 节省比例：约 30%-50%

🛠️ 开发

依赖

• Python 3.7+
• 无第三方依赖

本地开发

# 克隆仓库
git clone https://github.com/your-username/md-to-html.git
cd md-to-html

# 测试
python render.py examples/demo.md
python index.py

📄 许可

MIT License

🤝 贡献

欢迎提交 Issue 和 Pull Request！

📝 更新日志

v1.0.0 (2026-05-30)

• ✨ 初始版本
• ✅ MD → HTML 转换
• ✅ 交互式评论功能
• ✅ 回复功能（短回复/长回复）
• ✅ 自动归档到 archive/
• ✅ 索引页面生成
• ✅ 颜色区分用户和 Agent 评论