Communitygithub.com

GuilhermeGongora/VideoEditor

所有 Remotion 技能的总路由。

VideoEditor 是什么?

这是一个用于 Remotion 视频编辑的 AI 代理技能路由器。它统一管理多个子技能,包括创建新视频或合成、新项目设置、React 标记最佳实践、地图处理(Mapbox/MapLibre/MapTiler/GeoJSON/3D 地理飞越)、多媒体处理(裁剪、修剪、元数据提取)、交互性优化(让用户在 Studio 中交互式修改并写回代码)、字幕处理、SaaS/自动化/应用创建(包括 Lambda 渲染、Vercel/Cloudflare/Express.js 集成)、Remotion API 文档查询以及升级操作。核心工作流强调先启动 Studio 提供交互式预览,仅在用户明确要求时才渲染最终视频。在 Cursor 中自动打开浏览器,在其他代理客户端中支持 `--no-open` 模式并打印 URL 供内嵌浏览器使用。该技能适用于 Claude Code、Cursor、Codex 等代理平台,通过引用对应的 REFERENCE.md 文件来分派任务。

兼容平台~Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/GuilhermeGongora/VideoEditor/tree/HEAD/.claude/skills/remotion-best-practices

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

保留用户所做的修改

用户可能在与对话之外的代码中进行了修改。

如果您在此过程中发现意外的更改,请不要覆盖它们,应假定这些更改是故意的或要求确认。

创建视频

如果用户要求制作、创建或构建一个新的视频或合成,请加载 创建一个新的 Remotion 视频,无论是否已存在 Remotion 项目。

新项目设置

如果当前没有 Remotion 项目,请加载 创建一个新的 Remotion 项目。

React 标记最佳实践

如果您正在编写 Remotion React 标记,请加载 Remotion 标记最佳实践。

地图

对于静态地图、动画路线和标记、地理说明、Mapbox、MapLibre、MapTiler、GeoJSON 或 3D 地理飞越,请加载 Remotion 地图。

多媒体

为了在浏览器中实现多媒体任务,例如裁剪、修剪视频或获取其元数据,请加载 Remotion 多媒体。

改善交互性

通过良好地组织 Remotion 标记,我们可以允许用户在 Studio 中交互式更改内容并写回代码。如果相关: 交互性最佳实践。

打开预览

如果用户要求“制作”视频、“创建”视频等, 除非用户非常明确地要求,否则不要默认渲染视频。用户更希望看到交互式预览。 一旦项目可以运行,请先启动 Studio 并在浏览器中打开预览,然后再构建或编辑合成。保持预览打开状态,以便用户观察进度并指导您。

如果您正在使用 Cursor

运行 Studio 而不使用 --no-open,以便自动打开浏览器:

npx remotion studio

如果您正在使用其他具有内嵌浏览器的代理客户端

您可以使用上述命令让 Studio 打开浏览器,或运行:

npx remotion studio --no-open

这将启动一个长时间运行的进程,并打印预览的服务器 URL。 如果服务器已经启动,它将打印 URL。 如果您使用了 --no-open,请在内嵌浏览器中打开打印出的确切 URL,并验证 Studio 是否加载。一旦合成存在,请验证其视频预览是否加载。如果您无法在其中打开,请在不使用 --no-open 的情况下运行 Studio。 您可以通过导航至 /[composition-id] 访问特定合成,例如 http://localhost:3000/MapAnimation。

:::note Studio 支持 WebMCP 工具。 :::

如果您没有内嵌浏览器

这将在浏览器中打开 Studio 或如果已经打开则将其聚焦。

npx remotion studio

更多选项

要启动 Remotion Studio 中的项目、打开其确切的本地 URL 或配置 Studio CLI 标志,请加载 Remotion Studio。

渲染视频

仅在用户非常明确地要求时才渲染。 例如:“渲染视频”、“导出”、“给我 MP4”。

预览还提供了更直观的渲染界面,因此考虑使用它而不是命令行进行渲染。

npx remotion render

更多选项,请参见 渲染。

对于超出简单 npx remotion render 的高级渲染,请参见:渲染最佳实践。

字幕

在处理字幕时,请加载 Remotion 字幕。

创建 SaaS、自动化或应用

使用 Remotion SaaS 技能 了解关于基于 Remotion 的 SaaS 应用的知识,例如 <Player>、在 Lambda、Vercel、Cloudflare、通过 Express.js 渲染、客户端渲染或寻找合适的 SaaS 模板。

查阅 Remotion API 和文档

要查找并阅读最新的 Remotion 文档,请加载 Remotion 文档。

升级

要升级 Remotion、相关包、兼容的 Mediabunny 包以及已安装的 Remotion Agent 技能,请加载 Remotion 升级。

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

相关技能