import-canvas-capture

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Import Canvas Capture

导入 Canvas Capture

This is an internal, unstable workflow. Keep this skill in

.agents/skills

; do not distribute it through

packages/skills

or document the command as a stable API.

这是一个内部且不稳定的 workflow。请将此 skill 保留在

.agents/skills

中；不要通过

packages/skills

分发，也不要将该命令记录为稳定的 API。

Workflow

工作流

Locate the recorded capture file and the target Remotion project. The original recording must contain embedded
```
REMOTION_CAPTURE_DATA
```
metadata; a converted video that has lost this metadata cannot be imported.
Inspect the project to find the TypeScript file containing its composition registrations (usually
```
src/Root.tsx
```
). Choose an unused composition ID.

From the target project's root, run:

bunx remotion experimental-codemod add-canvas-capture /absolute/path/capture.webm \
  --composition-file src/Root.tsx \
  --id MyCapture

When developing this command in the monorepo, build the CLI first with

bun run build

, then invoke the local CLI from the target project's root:

node /absolute/path/to/remotion/packages/cli/remotion-cli.js \
  experimental-codemod add-canvas-capture /absolute/path/capture.webm \
  --composition-file src/Root.tsx --id MyCapture

Review the reported source files and public asset. The importer generates a component beside the registration file, registers it, copies the video to the public directory, and installs missing
```
@remotion/media
```
and
```
@remotion/mac-cursors
```
dependencies at the project's Remotion version. Studio does not need to be running. Existing Studio sessions pick up source changes through their file watchers; this operation does not enter Studio's undo stack.
Report the composition ID and changed files to the user.

找到录制文件和目标 Remotion 项目。原始录制文件必须包含嵌入的
```
REMOTION_CAPTURE_DATA
```
metadata；已丢失该 metadata 的转换后视频无法导入。
检查项目，找到包含 composition 注册信息的 TypeScript 文件（通常为
```
src/Root.tsx
```
）。选择一个未使用的 composition ID。

从目标项目的根目录运行：

bunx remotion experimental-codemod add-canvas-capture /absolute/path/capture.webm \
  --composition-file src/Root.tsx \
  --id MyCapture

在 monorepo 中开发此命令时，请先使用

bun run build

构建 CLI，然后从目标项目的根目录调用本地 CLI：

node /absolute/path/to/remotion/packages/cli/remotion-cli.js \
  experimental-codemod add-canvas-capture /absolute/path/capture.webm \
  --composition-file src/Root.tsx --id MyCapture

检查所报告的 source files 和 public asset。导入器会在 registration file 旁生成一个 component 并为其注册，将视频复制到 public 目录，并以项目的 Remotion version 为版本安装缺失的
```
@remotion/media
```
和
```
@remotion/mac-cursors
```
dependencies。Studio 无需运行。现有 Studio sessions 会通过 file watchers 感知 source changes；此操作不会进入 Studio 的 undo stack。
向用户报告 composition ID 和变更后的文件。

Options and conflicts

选项与冲突

Defaults match Studio's capture import: 1920×1080, 60 fps, and duration rounded up from the recording. Pass
```
--width
```
,
```
--height
```
, or
```
--fps
```
to override them. Recorded video dimensions remain independent from composition dimensions.
```
--public-dir
```
overrides the configured public directory.
```
--package-manager
```
selects the dependency installer.
```
--dry-run
```
parses the recording and generates source changes without installing dependencies or writing project files. The programmatic result includes the proposed source changes.
The registration file is resolved relative to the project root; the CLI capture path is resolved relative to the current working directory.
Existing component files and conflicting public assets are rejected. If the recording is already in the public directory, pass that file as the input to reuse it. Otherwise rename the input or select another composition ID; do not overwrite an existing asset or component to bypass an error.

默认值与 Studio 的 capture 导入一致：1920×1080、60 fps，duration 根据录制时长向上取整。可传入
```
--width
```
、
```
--height
```
或
```
--fps
```
覆盖这些默认值。录制视频的尺寸与 composition 尺寸彼此独立。
```
--public-dir
```
可覆盖配置的 public 目录。
```
--package-manager
```
用于选择 dependency installer。
```
--dry-run
```
会解析录制文件并生成 source changes，但不会安装 dependencies 或写入项目文件。programmatic result 包含建议的 source changes。
registration file 相对于项目根目录解析；CLI capture path 相对于当前工作目录解析。
已存在的 component files 和发生冲突的 public assets 会被拒绝。如果录制文件已位于 public 目录中，请将该文件作为输入传入以复用它。否则，请重命名输入文件或选择另一个 composition ID；不要通过覆盖现有 asset 或 component 来绕过错误。

Programmatic access

程序化访问

Use

CliInternals.importCanvasCapture

from

@remotion/cli

. It is internal and unstable. Its inputs are

captureFile

compositionFile

compositionId

remotionRoot

publicDir

fps

width

height

packageManager

logLevel

, and

dryRun

. Supply

null

for default directory, dimensions, frame rate, and package manager. File paths are resolved relative to

remotionRoot

The result contains the composition ID, source and asset paths, composition metadata, and codemod changes. Pass

dryRun: true

to inspect changes in memory.

使用

@remotion/cli

中的

CliInternals.importCanvasCapture

。它是内部且不稳定的。其 inputs 包括

captureFile

、

compositionFile

、

compositionId

、

remotionRoot

、

publicDir

、

fps

、

width

、

height

、

packageManager

、

logLevel

和

dryRun

。为 default directory、dimensions、frame rate 和 package manager 传入

null

。文件路径相对于

remotionRoot

解析。

结果包含 composition ID、source path、asset path、composition metadata 和 codemod changes。传入

dryRun: true

以在内存中检查变更。