这个项目能做什么

# html-video **HTML 变视频——就在你的笔记本上。** html-video 是一个程序化视频工具，让编码代理（Open Design, Windsurf CLI, Trae CLI, Claude Code, Cursor, Codex, Gemini, Grok, Qwen, OpenCode, Copilot, Aider, Hermes, 或 Anthropic API）将 HTML、CSS 和数据转化为真正的 MP4 文件。描述一个视频需求，粘贴文章链接或 GitHub 仓库地址，代理即可生成多帧动画视频，并通过可插拔引擎在本地完成渲染。Apache-2.0 授权，无按次渲染费用，无供应商锁定。 ## 主要特性 - **14 种代理后端**：自动检测并支持 Open Design (Vela), Windsurf CLI, Trae CLI, Claude Code, Cursor Agent, Codex CLI, Gemini CLI, Grok Build, Qwen Code, OpenCode, GitHub Copilot CLI, Aider, Hermes, 以及 Anthropic Messages API。 - **21 个精选模板**：许可证清洁的动画 HTML 模板，涵盖数据可视化（NYT 风格图表，瑞士/Vignelli 网格）、标题与特效（故障风，动态排版，打字机光标）、英雄区与电影感效果（液态渐变，漏光，暖色颗粒）、产品促销（15秒/30秒多场景），以及解说脚手架（决策树）。 - **真实 MP4 渲染**：无头 Chromium 录制动画 HTML，ffmpeg (libx264) 在本地编码为 MP4——无需云端渲染，无单片费用。 - **链接转视频**：在服务端抓取网络文章（包括微信公众号）或 GitHub 仓库，扁平化为 Markdown，并将真实内容输入到生成提示中。 - **AI 配乐**：通过 MiniMax 提供可选的背景音乐和旁白，并在导出时混入 MP4（音乐在人声下自动闪避，淡入淡出）。 - **工作室 + CLI**：本地浏览器工作室（聊天、模板库、帧编辑、配乐、导出）以及脚本化的 `html-video` CLI。 - **可插拔引擎架构**：统一的 `render(input, ctx)` 适配器接口；更换引擎（例如 Remotion, Motion Canvas）只需替换渲染步骤，分镜和代理循环保持不变。 - **构建即合规**：模板携带原始许可证，附带记录来源和 SPDX 标识的 `NOTICE.md`；不发布任何许可条款不明的宽松许可证代码。 ## 工作原理 1. **源获取**：Studio 在服务端拉取 URL 或仓库，扁平化为 Markdown。 2. **代理循环**：代理读取素材 + 模板样式，输出内容图（分镜）+ 每帧一个 HTML 块。 3. **内容图**：包含节点（实体/数据/文本）和边（序列/过渡）的多帧中间表示。 4. **逐帧 HTML**：每个节点成为磁盘上一个自包含的动画 HTML 帧。 5. **渲染**：每一帧 → webm（经由无头 Chromium），然后 ffmpeg 编码为 MP4 (libx264) 并拼接。 6. **配乐**：通过 ffmpeg 混合可选的 MiniMax 音乐 + 旁白。 单帧视频走快速路径，跳过内容图阶段。 ## 入门指南 需要 Node.js 20+ 和 ffmpeg。如果不存在，请安装 Playwright 的 Chromium。使用 `pnpm -r build` 进行构建。 CLI 实用工具： - `node packages/cli/dist/bin.js doctor` — 检测已安装的代理 + 引擎 - `node packages/cli/dist/bin.js search-templates --intent "github stars race" --top 3` 在工作室中：选择一个模板（或描述视频 / 粘贴链接），与你的代理聊天，编辑每帧文本，添加配乐，并导出 MP4。 ## 项目结构 - `runtime/` — 所有 14 种后端的代理运行时（检测/生成/流式传输） - `cli/` — `html-video` 命令，studio HTTP 服务器，源获取 - `project-studio/` — 浏览器工作室 UI（聊天、模板库、帧、配乐、导出） - `templates/` — 21 个精选、许可证清洁的视频模板 ## 相关项目 - [Open Design](https://github.com/nexu-io/open-design) — 姊妹项目，设计代理元层 - [HTML Anything](https://github.com/nexu-io/html-anything) — 用于静态 HTML 交付物的姊妹项目 ## 许可证 Apache-2.0 — 无按次渲染费用，无席位上限，无贡献者协议。由 Open Design 团队 (nexu-io) 发布的官方项目。