用途:以 React 组件方式生成视频,适合数据可视化、动态图表、产品演示、教学短视频等场景。当用户要求「用这些数据生成一个 XX 秒的视频」,或需要动态图表视频、产品演示视频、教学/口播视频,或把表格、图表、文案转成带动画的短视频时使用。
前置条件:Node.js(建议 v18+)与 npx;用户环境需已安装 Remotion,可用 npm init video 或 bun create video 创建项目,或在现有项目内 npm install remotion。
工作流程:一、确认环境,在用户项目或工作目录中确认存在 Remotion 项目(含 remotion.config.ts 或 remotion.config.js 及入口如 src/Root.tsx)。二、生成或修改 Composition,根据需求编写或修改 React 组件,可接收 getInputProps() 传入的数据(如图表数据、文案)。三、渲染视频,在项目根目录执行:npx remotion render <entry-point> <composition-id> <output-path>。其中 entry-point 为入口文件(如 src/index.tsx 或 src/Root.tsx),composition-id 为入口中注册的 Composition 的 id,output-path 为输出视频路径(如 ./out/video.mp4)。
传参与时长:需传入动态数据时使用 --props='{"key":"value"}' 或 --props=./props.json;时长由 Composition 的 durationInFrames / fps 决定。
输出:默认输出 MP4(H.264),可用 --codec 指定其他编码;输出路径由用户指定或放在项目 out/ 目录。
限制:需用户本机已具备 Remotion 项目或同意新建项目,无 Remotion 时需先引导 npm init video;复杂动画与长视频渲染耗时较长,可提示用户或使用 --concurrency 调整并行度。