Communitygithub.com

remotion-tiktok-gym-editor

所有 Remotion 技能的智能路由,管理视频创建、渲染、编辑工作流及最佳实践。

remotion-tiktok-gym-editor 是什么?

这是一个 Remotion 技能的路由器,它本身不直接提供某个具体功能,而是根据用户请求智能地加载对应的子技能参考文档。支持的场景包括:创建新视频或项目、编写 React 标记、处理地图与多媒体、提高 Studio 交互性、渲染和导出视频、处理字幕、搭建 SaaS 应用、查阅 API 文档以及升级依赖。当用户要求“制作”或“创建”视频时,该技能会提示先启动 Studio 预览,除非用户明确要求渲染。它还提供了针对不同客户端(Cursor、支持内置浏览器的 agent 客户端、无内置浏览器的客户端)的启动命令示例,并强调不要覆盖用户意外修改的代码。总之,这是一份高度结构化的决策指南,帮助 AI agent 精确调用正确的 Remotion 子技能。

兼容平台~Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/3bkader-gpt/remotion-tiktok-gym-editor/tree/HEAD/.agents/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

如果你正在使用其他带有内置浏览器的 agent 客户端

你可以使用上述命令让 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 2 individual skills — each has its own dedicated page.

相关技能