Remotion Mcp

remotion-mcp

MCP 服务，让你的 AI 助手无需 UI 即可创建、编辑和渲染 Remotion 视频。

让 Claude、Cursor 或 Windsurf 能够：

• 🎬 渲染 MP4 视频、静帧（PNG/JPEG）和动画 GIF
• 搭建并编辑 React/Remotion 组件
• 传入动态 inputProps，生成数据驱动的视频
• 检查项目文件树，并读取/写入合成文件
• 通过 job ID 异步跟踪耗时较长的渲染任务

初次使用？请阅读入门指南
想看实际示例？请查看 Cookbook → — 包含逐步讲解的视频教程和准确提示词

Cookbook	构建内容
01 — YouTube Intro	使用 5 条提示词制作动画标题卡 MP4
02 — Data-Driven Video	使用 N 组不同数据集渲染同一模板
03 — Edit & Iterate	快速完成读取 → 编辑 → 预览的循环

---

快速开始

🎥 查看实际效果

https://github.com/Vidhanvyrs/remotion-mcp/raw/master/examples/setupinide.mp4

前置条件

• Node.js ≥ 18
• 系统中已安装 Google Chrome

添加到 Claude Desktop

编辑 ~/.config/claude/claude_desktop_config.json（Linux/macOS）或
%APPDATA%\Claude\claude_desktop_config.json（Windows）：

{
  "mcpServers": {
    "remotion": {
      "command": "npx",
      "args": ["-y", "remotion-mcp"]
    }
  }
}

添加到 Cursor / Windsurf / VS Code

{
  "mcp": {
    "servers": {
      "remotion": {
        "command": "npx",
        "args": ["-y", "remotion-mcp"]
      }
    }
  }
}

重启编辑器，并让 AI “在 ~/my-video 创建一个 Remotion 项目并渲染它”。

---

可用工具

工具	描述
init_remotion_project	使用 React 模板搭建新的 Remotion 项目
list_compositions	列出项目中所有已注册的合成
list_project_files	返回项目的文件树（忽略 node_modules）
get_composition_code	读取项目中的任意源文件
update_composition	将新内容写入任意合成/组件文件
add_component	搭建新组件（basic、animated 或 sequence 模板）
create_composition_scaffold	创建最基本的合成文件
render_video	异步渲染 MP4 — 立即返回 jobId
render_still	将单帧渲染为 PNG/JPEG/WebP
render_gif	渲染动画 GIF
get_render_status	查询异步渲染任务的状态/进度
query_remotion_docs	查询 Remotion 官方文档，以便在生成代码前获取准确的 API 签名

---

文档依据

remotion-mcp 是唯一一个将实时执行与官方文档依据相结合的 Remotion MCP。

AI 助手即将搭建组件或配置渲染时，可以先调用 query_remotion_docs，从官方 @remotion/mcp 文档服务获取准确且最新的 API 签名。这意味着：

• 生成的组件代码使用正确且最新的 Remotion API — 而非可能过时的训练数据
• codec、pixelFormat 和 crf 等渲染选项会在执行前依据真实文档进行验证
• 如果渲染失败，AI 可以查找错误信息并自行修正

这是一个软依赖 — 如果文档服务不可用，query_remotion_docs 会妥善降级并提供有用提示，其他工具仍可正常工作。

---

未检测到 Chrome？

设置 CHROME_EXECUTABLE 环境变量：

{
  "mcpServers": {
    "remotion": {
      "command": "npx",
      "args": ["-y", "remotion-mcp"],
      "env": {
        "CHROME_EXECUTABLE": "/usr/bin/chromium"
      }
    }
  }
}

---

HTTP / 云模式

作为共享 HTTP 服务运行（适用于团队或托管演示）：

MCP_MODE=http PORT=3000 npx remotion-mcp

有关 Railway、Fly.io 和 Docker 的说明，请参阅 DEPLOYMENT.md。

---

开发

git clone https://github.com/Vidhanvyrs/remotion-mcp
cd remotion-mcp
npm install
npm run dev          # run with tsx (no build needed)
npm test             # run smoke tests
npm run build        # compile to dist/

有关如何添加新工具，请参阅 CONTRIBUTING.md。

---

许可证

ISC