开源工具推荐：HTML转MP4视频生成工具-小微之家 | 汪斌带你开公司

nexu-io/html-video 是由 Open Design 团队于 2026 年中开源的一款专为 AI 编程智能体（Coding Agent）设计的本地化“HTML 转视频”生成工具。它的核心理念是让 AI Agent 像“导演”一样，把网页链接、GitHub 仓库或是单句 Prompt 直接变成带动画和配音的高质量 MP4 视频，且整个渲染过程完全在本地免费进行，就是利用你自己电脑的算力。

以下是为你做的该项目的全面拆解与最佳部署方式指南：

一、核心特性与项目拆解 🛠️

该项目本质上是一个视频生成的“元层（Meta-Layer）”，Agent 只负责决策内容和分镜，底层的渲染引擎可以自由插拔。

1. 核心应用场景与工作流

一键“链接/仓库”转视频： 这是它最杀手级的应用。你可以丢给它一篇微信公众号文章链接、一个 GitHub 仓库地址，或者一段文本描述。工具会在服务端抓取并解析内容。
基于内容图谱生成（Content Graph）： Agent 读完文章后，会提取核心观点并将其结构化为“故事板”（分镜与内容图谱），匹配内置的视觉模板，生成带有数据或文本内容的独立 HTML 帧。
无缝衔接 14 种主流 Agent： 自动检测你电脑 PATH 中的 14 种常见本地编程代理，比如 Claude Code、Cursor、Windsurf、Trae CLI、GitHub Copilot、Qwen、Gemini 等。如果没有安装 CLI，直接填入 Anthropic API key 也能工作。

2. 多引擎架构（Pluggable Engines）

html-video 并没有把用户锁死在某一种特定的视频生成 DSL（领域特定语言）上：

目前默认引擎（Hyperframes）： 通过本地的 Headless Chromium（无头浏览器）逐帧录制带有 CSS/GSAP 动画的 HTML 页面，然后借助 FFmpeg 拼接成完整的视频（webm → mp4）。
未来扩展引擎： 架构上预留了对 Remotion（React 组件）、Motion Canvas（代码解说神器）和 Manim（数学与 3D）的支持。

3. 21 款内置商业级模板与 AI 音效

模板库： 包含 21 款具有干净开源协议（支持商用）的模板，覆盖数据可视化（纽约时报风格动态图表）、光斑电影感标题、VFX 终端光标效果、产品宣发等多场景。
AI 轨道配音： 支持接入 MiniMax API 实现 AI 语音解说（TTS）与背景音乐（BGM）生成，并在最终导出时通过 FFmpeg 自动混流，甚至支持人声时背景音量自动降低（Ducking）。

4. 0 成本，完全本地闭环

项目遵循 Apache-2.0 协议。与云端视频生成工具不同，它没有“每段视频 X 元”的渲染费用，没有账号席位限制，完全利用你的个人电脑算力处理所有渲染工作。

二、最佳部署方式 🚀

因为 html-video 是一款主打“开发者本地工作流（Local-first）”的工具，它的最佳部署方式就是直接部署在你的开发机/笔记本电脑上，而不是使用传统的 Docker/云端服务器部署（因为需要调用你本地安装的 Cursor/Windsurf 等 Agent 环境并调用本地浏览器渲染引擎）。

第一步：基础环境准备 (Prerequisites)

请确保你的电脑上已经安装了以下环境：

Node.js 20+ (node --version)
pnpm 9+ (pnpm --version)
FFmpeg：确保它在全局环境变量中 (ffmpeg -version)
Chromium 浏览器：如果系统内没有，建议使用 Playwright 安装，命令为：
bash npx playwright install chromium

第二步：克隆代码与编译

将仓库克隆到本地并进行依赖安装：

# 克隆仓库
git clone https://github.com/nexu-io/html-video.git
cd html-video

# 安装依赖
pnpm install

# 构建所有工作区包
pnpm -r build

第三步：启动本地 Studio

html-video 提供了一个很漂亮的本地浏览器交互工作台（Studio），通过以下命令启动：

node packages/cli/dist/bin.js studio

执行后，Studio 会自动在本地开启：http://127.0.0.1:3071。

第四步：模型接入与生成使用

选择 Agent（大脑）： 打开 Studio 页面后，顶栏会自动识别你电脑里已有的 Agent 客户端。如果你不想折腾 CLI，可以直接在设置中填入你自己的 Anthropic API Key (Claude)。直接填入Claude的 API Key，主要是为了替代 Claude Code 等外部命令行智能体。如果你本地不想安装或没有配置这些 CLI（命令行终端） 工具，项目会直接用这个 Key 调用官方 Claude 大模型的接口，来自动帮你分析内容、写 HTML 代码和编排分镜。
配音设置（可选）： 在 Settings → Audio 中输入 MiniMax API 密钥以解锁自动配音配乐功能。
开始创作：
- 在左侧选中想要的视频模板风格。
- 在对话框中粘贴你想要的公众号链接或 GitHub 仓库地址。
- 点击生成，Agent 会自动帮你梳理文案、编排分镜，在下方直接显示 HTML 预览，最后点击 Export MP4，Chromium 与 FFmpeg 会在后台静默录制并把 MP4 视频保存到你本地。