这次我们来看一个很有实际意义的组合Claude Code Remotion。目标只有一个——用自然语言和代码来“复刻”某种视频剪辑风格而不是打开 Premiere Pro 或者剪映一帧一帧去拖时间轴。先说结论这条路的本质是把“剪辑”变成“写代码”。Claude Code 负责理解你的意图帮你在项目里生成、修改和维护视频代码Remotion 负责把 React 组件渲染成真正的 MP4 文件。整个过程不依赖传统剪辑软件而且天然支持批量产出、版本管理和接口调用。这里的“中配”指的是性价比配置方案。你不需要订阅昂贵的剪辑工作站一台能跑 Node.js 的普通笔记本就够模型侧也不一定非要官方收费套餐接入 DeepSeek 或者 Ollama 本地模型就能把 Claude Code 驱动起来。这样的组合很适合程序员、自动化内容生产者以及所有想把“剪辑”从手动操作变成工程化流程的人。这篇博文会带你把环境装好把 Claude Code 跑起来创建一个 Remotion 项目然后用一句自然语言让 AI 生成一个带片头、字幕、分镜转场和片尾的短视频模板最后渲染成 MP4。整个过程可复现代码和命令都可以直接复制修改。1. 核心能力速览能力项说明核心工具Claude CodeAnthropic 的终端 AI 编程工具 RemotionReact 视频生成框架主要功能用自然语言指令生成视频模板代码、修改剪辑节奏、批量渲染不同素材的 MP4是否需要传统剪辑软件不需要Pr、剪映这类软件只在后续人工精修时可选用代码基础React TypeScript懂一点组件化思维就能上手渲染原理Remotion 通过 Chrome Headless 逐帧截帧并合成为视频最低环境Node.js 184GB 内存起步能运行 Chrome 即可模型接入方式官方订阅 / DeepSeek API / Ollama 本地模型 / 第三方 Anthropic 兼容接口是否支持 API 化Claude Code 有 CLI 非交互模式Remotion 有 Node API 可编程调用批量任务支持。模板参数化后可以循环渲染多条视频适合场景自动化短视频生产、内容模板开发、教学演示、程序化片头片尾这个组合最值得关注的一点视频不再是一个黑盒工程文件而是一段可搜索、可 diff、可复用、可批量修改的代码。你改一个参数就能生成 100 条不同文字的视频你换一个转场函数所有视频的节奏都会同步变化。2. 工作原理为什么剪辑能写成代码传统剪辑软件把视频抽象成时间轴上的素材块你要手动拖动、裁剪、叠加。Remotion 换了一种思路把“第几秒出现什么内容”变成代码逻辑。在 Remotion 里一个视频就是一个 React 组件。时间轴是由Sequence控制的比如第一段场景在 0 到 3 秒第二段场景从 3 秒到 11 秒。useCurrentFrame()可以拿到当前帧号然后用interpolate()把帧号映射到透明度、位移、缩放这些属性上这样就实现了转场、字幕弹出、画面滑动等效果。这正是“复刻剪辑风格”的关键。很多网络热梗视频的剪法本质上是一套固定的模板快节奏的字幕出现片段的抽帧循环标志性的转场音效文案的滚动落版。这些都可以抽象成 Remotion 组件。比如“人物出现在左侧右侧弹出字幕0.5 秒后字幕抖动放大”写一次通用组件之后替换文本就能套用。Claude Code 在这个流程里的角色是“写代码的助手”。你不用记忆 Remotion 的全部 API只要在终端里描述想要的画面效果让它生成组件不满意再让它调整参数。整个过程像和一个熟悉视频框架的程序员结对编程只不过这个程序员可以直接在本机项目里改文件、跑命令。需要特别注意边界复刻“风格”不等于盗用“素材”。如果你想做出某种影视名场面或网络热梗的版式节奏建议用自己的拍摄素材、自己的文案、自己的音频来套模板不要把未授权的影视片段直接放进去商用。3. 环境准备与前置条件动手之前先把环境确认一遍。下面的清单并不复杂但每一项都能影响你后面能不能顺利跑通。操作系统Windows 10/11、macOS、Linux 都可以。Clipboard 排序系统里 Windows 需要 PowerShell 或 Git Bash老版本 PowerShell 可能遇到执行策略问题。Node.jsRemotion 要求 Node.js 18 以上建议安装最新的 LTS 版本。安装好后在终端里执行node -v确认。npm 或 pnpmnpm 随 Node.js 一起安装如果项目比较大pnpm 的安装速度和磁盘占用更友好。浏览器内核Remotion 渲染时会自动下载 Chrome Headless Shell 用于截帧首次使用需要等待下载完成。ffmpegRemotion 4.x 在部分场景会用 ffmpeg 处理音频或格式转换。建议先装一个 ffmpeg省得后面报错也不知道原因。编辑器VS Code 可选装 Claude Code 扩展在图形界面里就能查看 AI 改动的代码对新手更友好。模型 API如果不用官方订阅需要准备一个 DeepSeek API Key如果走本地模型需要安装 Ollama 并提前拉取模型文件。磁盘空间代码项目本身只占几十 MB但渲染过程中的临时帧缓存、输出视频会占空间。批量渲染前给输出目录留出充足余量。检查完这些就可以开始安装了。4. 安装 Claude Code 与模型接入4.1 安装 CLIClaude Code 的默认安装方式是通过 npm 全局安装npm install -g anthropic-ai/claude-code安装完成后执行claude --version如果能看到版本号说明 CLI 已经可用。Windows PowerShell 用户如果遇到“无法加载文件因为在此系统上禁止运行脚本”之类的报错需要先确认执行策略Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser这个操作会把当前用户的脚本执行策略放宽到允许本地脚本运行不会影响系统级设置。4.2 方式 A官方订阅直接登录在终端输入claude进入交互界面后按提示登录授权账号。这种方式最简单模型能力也最完整适合预算充足、追求开箱即用的用户。4.3 方式 BDeepSeek API 接入这是目前“中配”路线里性价比较高的方案。DeepSeek 提供了 Anthropic 兼容接口Claude Code 可以直接通过环境变量指向 DeepSeek 的 endpoint。export ANTHROPIC_BASE_URLhttps://api.deepseek.com/anthropic export ANTHROPIC_AUTH_TOKENsk-你的DeepSeek密钥Windows PowerShell 下用同样的变量名$env:ANTHROPIC_BASE_URL https://api.deepseek.com/anthropic $env:ANTHROPIC_AUTH_TOKEN sk-你的DeepSeek密钥设置完成后运行claudeClaude Code 会以为自己连的是 Claude实际请求会转发到 DeepSeek。注意接口返回报错时先检查 Base URL 是否写成了https://api.deepseek.com而不是带/anthropic后缀的完整路径。4.4 方式 COllama 本地模型 cc-switch如果连 API 费用都不想花或者有离线要求可以用 Ollama 跑本地模型。先在本地启动 Ollama并拉取一个代码能力较强的模型比如 Qwen2.5-Coder 系列 7B/14B 版ollama pull qwen2.5-coder:7b ollama serveOllama 较新版本提供了 Anthropic 兼容端点地址形如http://localhost:11434/v1/anthropic。Claude Code 的环境变量指向该地址即可在离线环境下使用本地模型。不过每次都手动设置环境变量比较麻烦社区常用的工具是cc-switch。它可以在 Claude Code 的多个 API 供应商之间一键切换官方、DeepSeek、Ollama 等。你只需要在 cc-switch 的界面上把供应商地址和 token 填好切换到哪一个Claude Code 下次启动就会用哪一个。这个工具适合需要在不同模型之间频繁对比的用户。4.5 VS Code 扩展如果你更习惯图形界面可以在 VS Code 扩展市场搜索 “Claude Code”安装官方或社区维护的扩展。安装后项目目录下的终端会集成 Claude Code 面板AI 生成的代码会直接以 diff 形式显示方便核对。用这种扩展接入 Ollama 或 DeepSeek 的道理和 CLI 完全一致核心都是环境变量和 Base URL 的配置。遇到“模型不被当前版本 Claude Code 识别”之类的提示通常是配置里指定了过长的模型名或本地模型名称错误改成ANTHROPIC_MODEL环境变量并填实际模型名即可。5. 创建 Remotion 视频项目接下来创建视频项目。Remotion 官方提供了一套模板脚手架可以直接在命令行里生成npx create-videolatest my-video cd my-video npm install脚手架会询问你使用 JavaScript 还是 TypeScript建议选 TypeScript后续维护模板时类型提示会很有帮助。安装完成后启动开发服务器npm run dev浏览器会自动打开http://localhost:3000你能在页面上看到 Remotion 自带的预览界面。左边是视频的实时预览右边是时间轴和参数面板拖动进度条能看到每一帧的效果这个预览体验比传统剪辑软件还直观。项目核心目录结构如下my-video/ src/ index.ts # 注册所有视频 composition Root.tsx # 定义 composition 的名字、分辨率、帧率 Video.tsx # 主视频组件 components/ # 场景组件后续由 Claude Code 生成 public/ # 静态素材图片、字体、音频等 out/ # 渲染输出的视频文件Root.tsx里定义了视频的基础参数export const RemotionRoot: React.FC () { return ( Composition idMyVideo component{Video} durationInFrames{450} fps{30} width{1920} height{1080} / / ); };这段代码表示视频总长 450 帧每秒 30 帧也就是 15 秒分辨率 1920x1080。改durationInFrames就会改变视频长度改fps会改变流畅度。先理解这几个参数后面让 Claude Code 写代码时你才知道怎么提要求。6. 用 Claude Code 生成视频模板6.1 启动 Claude Code在my-video项目根目录打开终端输入claude启动交互模式。Claude Code 会读取项目文件结构知道这是一个 Remotion 项目。如果环境变量已经指向 DeepSeek 或 Ollama它会直接用对应模型响应。6.2 输入自然语言指令下面的 prompt 是一个可以直接用的示例目标是生成一个 15 秒的短视频模板前 3 秒片头标题中间 8 秒三张图片轮播并带字幕最后 4 秒片尾文字。请在当前 Remotion 项目中新增一个视频模板要求 1. 总时长 15 秒1920x108030fps。 2. 前 3 秒是片头显示大标题“每日科技快讯”背景用深色渐变。 3. 第 3 秒到第 11 秒三张图片依次轮播每张 2.5 秒左右图片从 public 目录读取。 4. 播放图片时底部会弹出说明字幕字幕要有淡入效果。 5. 最后 4 秒是片尾显示“关注我每天 1 分钟看懂科技圈”。 6. 把视频注册到 Root.tsxcomposition id 命名为 DailyTechNews。Claude Code 会读Root.tsx、src目录结构然后创建对应的场景组件修改Root.tsx注册新 composition。整个过程它会在终端里输出“读取了哪些文件、新增了哪些文件”你只需要确认它没有覆盖已有文件。6.3 生成的视频代码长什么样Claude Code 生成的核心代码大致会是这样import { AbsoluteFill, Sequence, interpolate, useCurrentFrame, Img, staticFile } from remotion; const TitleScene: React.FC () { const frame useCurrentFrame(); const opacity interpolate(frame, [0, 20], [0, 1], { extrapolateRight: clamp, }); return ( AbsoluteFill style{{ justifyContent: center, alignItems: center, background: linear-gradient(135deg, #1a1a2e, #16213e) }} div style{{ opacity, fontSize: 72, color: #fff, fontWeight: bold }} 每日科技快讯 /div /AbsoluteFill ); }; const ImageScene: React.FC{ images: string[] } ({ images }) { const frame useCurrentFrame(); const index Math.min(Math.floor(frame / 75), images.length - 1); const fade interpolate(frame % 75, [60, 75], [0, 1], { extrapolateLeft: clamp, extrapolateRight: clamp }); return ( AbsoluteFill style{{ justifyContent: center, alignItems: center }} Img src{staticFile(images[index])} style{{ width: 80% }} / div style{{ opacity: fade, fontSize: 36, color: #fff }}说明字幕/div /AbsoluteFill ); };看到这样的代码你不需要背下来但要能看懂逻辑staticFile读取 public 目录素材interpolate控制透明度Sequence决定时间位置。这就是 Remotion 的日常工作方式。6.4 验证模板效果让 Claude Code 改完代码后切回http://localhost:3000的预览页面在左上角 composition 列表里选择DailyTechNews拖动时间轴确认0 到 3 秒是否显示片头标题。第 3 秒之后是否开始轮播图片并显示字幕。最后 4 秒是否有片尾文字。整体是否有明显的转场或淡入效果。如果效果不符合预期直接在 Claude Code 终端里描述问题例如“片头文字出现得太突然改成从透明到完全显示需要 0.5 秒的渐入效果”。它会修改对应代码你保存后刷新预览就能看到新效果。7. 批量渲染与接口化7.1 单条渲染命令预览确认没问题后可以渲染成 MP4。Remotion 的渲染命令是npx remotion render src/index.ts DailyTechNews out/daily-news.mp4首次渲染会下载 Chrome Headless Shell耗时取决于网络之后渲染就只消耗 CPU 资源了。渲染过程中终端的进度条会显示当前帧数和百分比。7.2 参数化模板一套模板批量出片批量任务的前提是把视频内容参数化。不要在组件里写死文案和图片路径而是把文案、图片、背景色等作为 props 传入export const DailyTechNews: React.FC{ title: string; subtitle: string; images: string[]; } ({ title, subtitle, images }) { return ( AbsoluteFill Sequence durationInFrames{90} TitleScene title{title} / /Sequence Sequence from{90} durationInFrames{240} ImageScene images{images} / /Sequence Sequence from{330} durationInFrames{120} EndingScene subtitle{subtitle} / /Sequence /AbsoluteFill ); };然后在渲染时通过--props传入 JSONnpx remotion render src/index.ts DailyTechNews out/news-001.mp4 --props{title:AI 日报,subtitle:关注我,images:[img1.png,img2.png,img3.png]}这意味着准备 10 份 JSON 数据就能渲染出 10 条不同内容的视频。批量脚本可以用简单的 Python 或 shell 循环实现import subprocess, json items [ {title: AI 日报, subtitle: 关注看更多, images: [1.png, 2.png, 3.png]}, {title: 科技早报, subtitle: 每天 1 分钟, images: [4.png, 5.png, 6.png]}, ] for i, item in enumerate(items): props json.dumps(item) cmd fnpx remotion render src/index.ts DailyTechNews out/news-{i}.mp4 --props{json.dumps(props)} subprocess.run(cmd, shellTrue)这样“批量出片”就从剪辑软件的重复劳动变成了一次脚本循环。7.3 非交互模式让 Claude Code 进入流水线Claude Code 除了交互模式还支持非交互模式。你可以用一条命令让 AI 完成特定任务而不用打开交互界面claude -p 把 src/components/TitleScene.tsx 里的标题字号从 72 改成 96背景色改成黑色到深蓝色的渐变这种模式非常适合嵌入自动化脚本比如每天定时让 Claude Code 生成一份新的字幕数据然后脚本再调用 Remotion 渲染。两者合在一起就是一条“文案输入 - AI 改代码 - 参数渲染 - MP4 输出”的自动化流水线。7.4 MCP 扩展Claude Code 支持 MCPModel Context Protocol这给了它连接外部工具的能力。社区已经有人在做“视频渲染 MCP 服务”把 Remotion 的渲染命令封装成 MCP toolClaude Code 可以直接调用渲染接口而不需要每次都手动执行命令行。当然MCP 服务的编写需要一些后端基础但收益也很明显以后你只要在 Claude Code 里说“渲染今天早报的视频”它就自动完成从组成、修改、渲染到输出的全部动作。8. 资源占用与性能观察这个组合对硬件要求不高但不同环节的资源占用表现差异明显。先说 Claude Code 本身。它是一个 Node.js 进程日常交互时的内存占用并不高。如果接的是 DeepSeek API本机几乎不消耗 GPU只承担代码生成和文件读写如果接的是 Ollama 本地模型那就要看模型大小了7B 量化模型通常需要 8GB 左右内存14B 模型建议 16GB 内存具体显存占用需要以本机运行ollama ps观察为准。Remotion 渲染阶段是资源消耗最集中的时候。预览时 Chrome 截帧的压力较小但正式渲染 1080p 视频时CPU 会明显升高分辨率越高、时长越长、特效越复杂渲染时间越长。fps30、durationInFrames450意味着要渲染 450 帧每一帧都执行一次完整的 React 渲染和 Chrome 页面截图所以几十秒的视频渲染几分钟到十几分钟都是正常的。如果觉得渲染太慢可以做三件事降低分辨率先渲染 1280x720 验证效果确认没问题再输出 1080p。减少特效复杂度特别是避免每帧执行大量 Canvas 绘制。关闭其他 Chrome 窗口释放内存防止页面被系统回收导致渲染中断。另外要注意Remotion 渲染时会在缓存目录写入大量临时文件磁盘空间不足会直接导致渲染失败。批量渲染前先确认输出目录所在磁盘至少有 5GB 以上的可用空间。9. 常见问题与排查方法问题现象可能原因排查方式解决方案claude命令不存在npm 全局安装路径不在 PATH 中执行npm bin -g查看路径把路径加入 PATH或者重新安装PowerShell 安装报错脚本执行策略限制Get-ExecutionPolicy查看策略Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUserClaude Code 输出乱码终端编码不是 UTF-8或 Windows 代码页问题执行chcp 65001切换为 UTF-8 代码页DeepSeek 接口返回 404Base URL 缺少/anthropic后缀检查环境变量改成https://api.deepseek.com/anthropic“模型不被当前版本识别”ANTHROPIC_MODEL指定了不存在的模型名运行claude -p ping查看输出改成实际可用的模型名如deepseek-chatcc-switch 切换后没效果环境变量未重新加载重启终端关闭再打开终端或重启 VS CodeRemotion 预览白屏依赖没装全查看终端报错重新npm install首次渲染时 Chrome 下载失败网络问题查看渲染日志重新执行渲染命令行让它重试视频里没有声音组件里没有引入音频检查 Remotion 的Audio组件用AudiostaticFile引入音轨批量任务中途卡住某个素材不存在或多个进程端口冲突查看输出目录和日志分小批渲染加日志和失败重试最常见的问题集中在环境变量失效和模型名写错。建议把环境变量写进 shell 的配置文件而不是每次临时 export模型名以供应商文档为准不要从网上复制一个就拿过来用。10. 最佳实践与使用建议第一第一次跑通时不要追求复杂效果。先渲染一个最简单的“圆角矩形从透明到显示”的模板确认整条链路可用再逐步加字幕、图片、转场。这条建议能帮你把“项目配置问题”和“效果设计问题”分开定位。第二保持项目结构清晰。每个场景单独拆成一个组件Root.tsx只做注册渲染参数通过 props 传入。这样 Claude Code 改文件时改动范围更小不容易改坏其他模块。第三把有效的 prompt 存进项目仓库。Claude Code 的上下文是有限的如果用交互模式做了很多次修改历史记录会变长。建议写一个PROMPTS.md把常用的模板修改指令保存下来下次直接复制使用遇到上下文太长时用/clear清空再基于PROMPTS.md重新描述。第四批量任务要加日志和失败重试。渲染 100 条视频时任何一条出错都可能中断流程。脚本里建议记录每一条的渲染状态并设置失败后重试 2 次的逻辑。第五版权和授权问题必须放在第一位。做模板复刻或者风格复刻时不要直接使用未授权的影视画面、音乐、人脸肖像或品牌标志。演示素材用自己拍摄的画面或免版权素材音频用自己合成或明确授权的内容。如果涉及声音克隆、数字人、换脸类功能更需要确认被克隆者已签署授权协议且只在安全边界内做技术验证。第六接口服务要注意访问控制。如果把渲染能力封装成 API 服务并放在公网一定要加身份校验只允许可信的调用方访问避免被刷量或滥用。11. 总结与下一步这个组合最值得尝试的点是把“剪辑”完全从时间轴的拖动中解放出来。Claude Code 负责用自然语言生成和调整代码Remotion 负责把代码变成视频两者结合之后你得到的是一个可复用、可批量、可接口化的视频生产工具链。建议你最先验证一个 5 秒的文字动画模板从创建项目到渲染出 MP4 应该不超过半小时。最容易踩的坑有三个环境变量没加载导致模型连不上、首次渲染时 Chrome Headless 下载慢、批量脚本缺少日志导致出错难定位提前避开就好。后续可以扩展的方向很多接入 TTS 引擎给视频生成配音配合 OCR 工具把图文内容自动转成视频字幕或者做一个定时任务每天早上抓取一份内容数据自动渲染成固定风格的短视频。这套组合的上限取决于你愿意把多少视频生产逻辑抽象成代码。建议收藏备用动手时从最小的模板开始。 
长河君 · 2026/9/8 5:31:27 · 阅读 1.2k Claude Code + Remotion：用自然语言和代码实现自动化视频剪辑
这次我们来看一个很有实际意义的组合Claude Code Remotion。目标只有一个——用自然语言和代码来“复刻”某种视频剪辑风格而不是打开 Premiere Pro 或者剪映一帧一帧去拖时间轴。先说结论这条路的本质是把“剪辑”变成“写代码”。Claude Code 负责理解你的意图帮你在项目里生成、修改和维护视频代码Remotion 负责把 React 组件渲染成真正的 MP4 文件。整个过程不依赖传统剪辑软件而且天然支持批量产出、版本管理和接口调用。这里的“中配”指的是性价比配置方案。你不需要订阅昂贵的剪辑工作站一台能跑 Node.js 的普通笔记本就够模型侧也不一定非要官方收费套餐接入 DeepSeek 或者 Ollama 本地模型就能把 Claude Code 驱动起来。这样的组合很适合程序员、自动化内容生产者以及所有想把“剪辑”从手动操作变成工程化流程的人。这篇博文会带你把环境装好把 Claude Code 跑起来创建一个 Remotion 项目然后用一句自然语言让 AI 生成一个带片头、字幕、分镜转场和片尾的短视频模板最后渲染成 MP4。整个过程可复现代码和命令都可以直接复制修改。1. 核心能力速览能力项说明核心工具Claude CodeAnthropic 的终端 AI 编程工具 RemotionReact 视频生成框架主要功能用自然语言指令生成视频模板代码、修改剪辑节奏、批量渲染不同素材的 MP4是否需要传统剪辑软件不需要Pr、剪映这类软件只在后续人工精修时可选用代码基础React TypeScript懂一点组件化思维就能上手渲染原理Remotion 通过 Chrome Headless 逐帧截帧并合成为视频最低环境Node.js 184GB 内存起步能运行 Chrome 即可模型接入方式官方订阅 / DeepSeek API / Ollama 本地模型 / 第三方 Anthropic 兼容接口是否支持 API 化Claude Code 有 CLI 非交互模式Remotion 有 Node API 可编程调用批量任务支持。模板参数化后可以循环渲染多条视频适合场景自动化短视频生产、内容模板开发、教学演示、程序化片头片尾这个组合最值得关注的一点视频不再是一个黑盒工程文件而是一段可搜索、可 diff、可复用、可批量修改的代码。你改一个参数就能生成 100 条不同文字的视频你换一个转场函数所有视频的节奏都会同步变化。2. 工作原理为什么剪辑能写成代码传统剪辑软件把视频抽象成时间轴上的素材块你要手动拖动、裁剪、叠加。Remotion 换了一种思路把“第几秒出现什么内容”变成代码逻辑。在 Remotion 里一个视频就是一个 React 组件。时间轴是由Sequence控制的比如第一段场景在 0 到 3 秒第二段场景从 3 秒到 11 秒。useCurrentFrame()可以拿到当前帧号然后用interpolate()把帧号映射到透明度、位移、缩放这些属性上这样就实现了转场、字幕弹出、画面滑动等效果。这正是“复刻剪辑风格”的关键。很多网络热梗视频的剪法本质上是一套固定的模板快节奏的字幕出现片段的抽帧循环标志性的转场音效文案的滚动落版。这些都可以抽象成 Remotion 组件。比如“人物出现在左侧右侧弹出字幕0.5 秒后字幕抖动放大”写一次通用组件之后替换文本就能套用。Claude Code 在这个流程里的角色是“写代码的助手”。你不用记忆 Remotion 的全部 API只要在终端里描述想要的画面效果让它生成组件不满意再让它调整参数。整个过程像和一个熟悉视频框架的程序员结对编程只不过这个程序员可以直接在本机项目里改文件、跑命令。需要特别注意边界复刻“风格”不等于盗用“素材”。如果你想做出某种影视名场面或网络热梗的版式节奏建议用自己的拍摄素材、自己的文案、自己的音频来套模板不要把未授权的影视片段直接放进去商用。3. 环境准备与前置条件动手之前先把环境确认一遍。下面的清单并不复杂但每一项都能影响你后面能不能顺利跑通。操作系统Windows 10/11、macOS、Linux 都可以。Clipboard 排序系统里 Windows 需要 PowerShell 或 Git Bash老版本 PowerShell 可能遇到执行策略问题。Node.jsRemotion 要求 Node.js 18 以上建议安装最新的 LTS 版本。安装好后在终端里执行node -v确认。npm 或 pnpmnpm 随 Node.js 一起安装如果项目比较大pnpm 的安装速度和磁盘占用更友好。浏览器内核Remotion 渲染时会自动下载 Chrome Headless Shell 用于截帧首次使用需要等待下载完成。ffmpegRemotion 4.x 在部分场景会用 ffmpeg 处理音频或格式转换。建议先装一个 ffmpeg省得后面报错也不知道原因。编辑器VS Code 可选装 Claude Code 扩展在图形界面里就能查看 AI 改动的代码对新手更友好。模型 API如果不用官方订阅需要准备一个 DeepSeek API Key如果走本地模型需要安装 Ollama 并提前拉取模型文件。磁盘空间代码项目本身只占几十 MB但渲染过程中的临时帧缓存、输出视频会占空间。批量渲染前给输出目录留出充足余量。检查完这些就可以开始安装了。4. 安装 Claude Code 与模型接入4.1 安装 CLIClaude Code 的默认安装方式是通过 npm 全局安装npm install -g anthropic-ai/claude-code安装完成后执行claude --version如果能看到版本号说明 CLI 已经可用。Windows PowerShell 用户如果遇到“无法加载文件因为在此系统上禁止运行脚本”之类的报错需要先确认执行策略Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser这个操作会把当前用户的脚本执行策略放宽到允许本地脚本运行不会影响系统级设置。4.2 方式 A官方订阅直接登录在终端输入claude进入交互界面后按提示登录授权账号。这种方式最简单模型能力也最完整适合预算充足、追求开箱即用的用户。4.3 方式 BDeepSeek API 接入这是目前“中配”路线里性价比较高的方案。DeepSeek 提供了 Anthropic 兼容接口Claude Code 可以直接通过环境变量指向 DeepSeek 的 endpoint。export ANTHROPIC_BASE_URLhttps://api.deepseek.com/anthropic export ANTHROPIC_AUTH_TOKENsk-你的DeepSeek密钥Windows PowerShell 下用同样的变量名$env:ANTHROPIC_BASE_URL https://api.deepseek.com/anthropic $env:ANTHROPIC_AUTH_TOKEN sk-你的DeepSeek密钥设置完成后运行claudeClaude Code 会以为自己连的是 Claude实际请求会转发到 DeepSeek。注意接口返回报错时先检查 Base URL 是否写成了https://api.deepseek.com而不是带/anthropic后缀的完整路径。4.4 方式 COllama 本地模型 cc-switch如果连 API 费用都不想花或者有离线要求可以用 Ollama 跑本地模型。先在本地启动 Ollama并拉取一个代码能力较强的模型比如 Qwen2.5-Coder 系列 7B/14B 版ollama pull qwen2.5-coder:7b ollama serveOllama 较新版本提供了 Anthropic 兼容端点地址形如http://localhost:11434/v1/anthropic。Claude Code 的环境变量指向该地址即可在离线环境下使用本地模型。不过每次都手动设置环境变量比较麻烦社区常用的工具是cc-switch。它可以在 Claude Code 的多个 API 供应商之间一键切换官方、DeepSeek、Ollama 等。你只需要在 cc-switch 的界面上把供应商地址和 token 填好切换到哪一个Claude Code 下次启动就会用哪一个。这个工具适合需要在不同模型之间频繁对比的用户。4.5 VS Code 扩展如果你更习惯图形界面可以在 VS Code 扩展市场搜索 “Claude Code”安装官方或社区维护的扩展。安装后项目目录下的终端会集成 Claude Code 面板AI 生成的代码会直接以 diff 形式显示方便核对。用这种扩展接入 Ollama 或 DeepSeek 的道理和 CLI 完全一致核心都是环境变量和 Base URL 的配置。遇到“模型不被当前版本 Claude Code 识别”之类的提示通常是配置里指定了过长的模型名或本地模型名称错误改成ANTHROPIC_MODEL环境变量并填实际模型名即可。5. 创建 Remotion 视频项目接下来创建视频项目。Remotion 官方提供了一套模板脚手架可以直接在命令行里生成npx create-videolatest my-video cd my-video npm install脚手架会询问你使用 JavaScript 还是 TypeScript建议选 TypeScript后续维护模板时类型提示会很有帮助。安装完成后启动开发服务器npm run dev浏览器会自动打开http://localhost:3000你能在页面上看到 Remotion 自带的预览界面。左边是视频的实时预览右边是时间轴和参数面板拖动进度条能看到每一帧的效果这个预览体验比传统剪辑软件还直观。项目核心目录结构如下my-video/ src/ index.ts # 注册所有视频 composition Root.tsx # 定义 composition 的名字、分辨率、帧率 Video.tsx # 主视频组件 components/ # 场景组件后续由 Claude Code 生成 public/ # 静态素材图片、字体、音频等 out/ # 渲染输出的视频文件Root.tsx里定义了视频的基础参数export const RemotionRoot: React.FC () { return ( Composition idMyVideo component{Video} durationInFrames{450} fps{30} width{1920} height{1080} / / ); };这段代码表示视频总长 450 帧每秒 30 帧也就是 15 秒分辨率 1920x1080。改durationInFrames就会改变视频长度改fps会改变流畅度。先理解这几个参数后面让 Claude Code 写代码时你才知道怎么提要求。6. 用 Claude Code 生成视频模板6.1 启动 Claude Code在my-video项目根目录打开终端输入claude启动交互模式。Claude Code 会读取项目文件结构知道这是一个 Remotion 项目。如果环境变量已经指向 DeepSeek 或 Ollama它会直接用对应模型响应。6.2 输入自然语言指令下面的 prompt 是一个可以直接用的示例目标是生成一个 15 秒的短视频模板前 3 秒片头标题中间 8 秒三张图片轮播并带字幕最后 4 秒片尾文字。请在当前 Remotion 项目中新增一个视频模板要求 1. 总时长 15 秒1920x108030fps。 2. 前 3 秒是片头显示大标题“每日科技快讯”背景用深色渐变。 3. 第 3 秒到第 11 秒三张图片依次轮播每张 2.5 秒左右图片从 public 目录读取。 4. 播放图片时底部会弹出说明字幕字幕要有淡入效果。 5. 最后 4 秒是片尾显示“关注我每天 1 分钟看懂科技圈”。 6. 把视频注册到 Root.tsxcomposition id 命名为 DailyTechNews。Claude Code 会读Root.tsx、src目录结构然后创建对应的场景组件修改Root.tsx注册新 composition。整个过程它会在终端里输出“读取了哪些文件、新增了哪些文件”你只需要确认它没有覆盖已有文件。6.3 生成的视频代码长什么样Claude Code 生成的核心代码大致会是这样import { AbsoluteFill, Sequence, interpolate, useCurrentFrame, Img, staticFile } from remotion; const TitleScene: React.FC () { const frame useCurrentFrame(); const opacity interpolate(frame, [0, 20], [0, 1], { extrapolateRight: clamp, }); return ( AbsoluteFill style{{ justifyContent: center, alignItems: center, background: linear-gradient(135deg, #1a1a2e, #16213e) }} div style{{ opacity, fontSize: 72, color: #fff, fontWeight: bold }} 每日科技快讯 /div /AbsoluteFill ); }; const ImageScene: React.FC{ images: string[] } ({ images }) { const frame useCurrentFrame(); const index Math.min(Math.floor(frame / 75), images.length - 1); const fade interpolate(frame % 75, [60, 75], [0, 1], { extrapolateLeft: clamp, extrapolateRight: clamp }); return ( AbsoluteFill style{{ justifyContent: center, alignItems: center }} Img src{staticFile(images[index])} style{{ width: 80% }} / div style{{ opacity: fade, fontSize: 36, color: #fff }}说明字幕/div /AbsoluteFill ); };看到这样的代码你不需要背下来但要能看懂逻辑staticFile读取 public 目录素材interpolate控制透明度Sequence决定时间位置。这就是 Remotion 的日常工作方式。6.4 验证模板效果让 Claude Code 改完代码后切回http://localhost:3000的预览页面在左上角 composition 列表里选择DailyTechNews拖动时间轴确认0 到 3 秒是否显示片头标题。第 3 秒之后是否开始轮播图片并显示字幕。最后 4 秒是否有片尾文字。整体是否有明显的转场或淡入效果。如果效果不符合预期直接在 Claude Code 终端里描述问题例如“片头文字出现得太突然改成从透明到完全显示需要 0.5 秒的渐入效果”。它会修改对应代码你保存后刷新预览就能看到新效果。7. 批量渲染与接口化7.1 单条渲染命令预览确认没问题后可以渲染成 MP4。Remotion 的渲染命令是npx remotion render src/index.ts DailyTechNews out/daily-news.mp4首次渲染会下载 Chrome Headless Shell耗时取决于网络之后渲染就只消耗 CPU 资源了。渲染过程中终端的进度条会显示当前帧数和百分比。7.2 参数化模板一套模板批量出片批量任务的前提是把视频内容参数化。不要在组件里写死文案和图片路径而是把文案、图片、背景色等作为 props 传入export const DailyTechNews: React.FC{ title: string; subtitle: string; images: string[]; } ({ title, subtitle, images }) { return ( AbsoluteFill Sequence durationInFrames{90} TitleScene title{title} / /Sequence Sequence from{90} durationInFrames{240} ImageScene images{images} / /Sequence Sequence from{330} durationInFrames{120} EndingScene subtitle{subtitle} / /Sequence /AbsoluteFill ); };然后在渲染时通过--props传入 JSONnpx remotion render src/index.ts DailyTechNews out/news-001.mp4 --props{title:AI 日报,subtitle:关注我,images:[img1.png,img2.png,img3.png]}这意味着准备 10 份 JSON 数据就能渲染出 10 条不同内容的视频。批量脚本可以用简单的 Python 或 shell 循环实现import subprocess, json items [ {title: AI 日报, subtitle: 关注看更多, images: [1.png, 2.png, 3.png]}, {title: 科技早报, subtitle: 每天 1 分钟, images: [4.png, 5.png, 6.png]}, ] for i, item in enumerate(items): props json.dumps(item) cmd fnpx remotion render src/index.ts DailyTechNews out/news-{i}.mp4 --props{json.dumps(props)} subprocess.run(cmd, shellTrue)这样“批量出片”就从剪辑软件的重复劳动变成了一次脚本循环。7.3 非交互模式让 Claude Code 进入流水线Claude Code 除了交互模式还支持非交互模式。你可以用一条命令让 AI 完成特定任务而不用打开交互界面claude -p 把 src/components/TitleScene.tsx 里的标题字号从 72 改成 96背景色改成黑色到深蓝色的渐变这种模式非常适合嵌入自动化脚本比如每天定时让 Claude Code 生成一份新的字幕数据然后脚本再调用 Remotion 渲染。两者合在一起就是一条“文案输入 - AI 改代码 - 参数渲染 - MP4 输出”的自动化流水线。7.4 MCP 扩展Claude Code 支持 MCPModel Context Protocol这给了它连接外部工具的能力。社区已经有人在做“视频渲染 MCP 服务”把 Remotion 的渲染命令封装成 MCP toolClaude Code 可以直接调用渲染接口而不需要每次都手动执行命令行。当然MCP 服务的编写需要一些后端基础但收益也很明显以后你只要在 Claude Code 里说“渲染今天早报的视频”它就自动完成从组成、修改、渲染到输出的全部动作。8. 资源占用与性能观察这个组合对硬件要求不高但不同环节的资源占用表现差异明显。先说 Claude Code 本身。它是一个 Node.js 进程日常交互时的内存占用并不高。如果接的是 DeepSeek API本机几乎不消耗 GPU只承担代码生成和文件读写如果接的是 Ollama 本地模型那就要看模型大小了7B 量化模型通常需要 8GB 左右内存14B 模型建议 16GB 内存具体显存占用需要以本机运行ollama ps观察为准。Remotion 渲染阶段是资源消耗最集中的时候。预览时 Chrome 截帧的压力较小但正式渲染 1080p 视频时CPU 会明显升高分辨率越高、时长越长、特效越复杂渲染时间越长。fps30、durationInFrames450意味着要渲染 450 帧每一帧都执行一次完整的 React 渲染和 Chrome 页面截图所以几十秒的视频渲染几分钟到十几分钟都是正常的。如果觉得渲染太慢可以做三件事降低分辨率先渲染 1280x720 验证效果确认没问题再输出 1080p。减少特效复杂度特别是避免每帧执行大量 Canvas 绘制。关闭其他 Chrome 窗口释放内存防止页面被系统回收导致渲染中断。另外要注意Remotion 渲染时会在缓存目录写入大量临时文件磁盘空间不足会直接导致渲染失败。批量渲染前先确认输出目录所在磁盘至少有 5GB 以上的可用空间。9. 常见问题与排查方法问题现象可能原因排查方式解决方案claude命令不存在npm 全局安装路径不在 PATH 中执行npm bin -g查看路径把路径加入 PATH或者重新安装PowerShell 安装报错脚本执行策略限制Get-ExecutionPolicy查看策略Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUserClaude Code 输出乱码终端编码不是 UTF-8或 Windows 代码页问题执行chcp 65001切换为 UTF-8 代码页DeepSeek 接口返回 404Base URL 缺少/anthropic后缀检查环境变量改成https://api.deepseek.com/anthropic“模型不被当前版本识别”ANTHROPIC_MODEL指定了不存在的模型名运行claude -p ping查看输出改成实际可用的模型名如deepseek-chatcc-switch 切换后没效果环境变量未重新加载重启终端关闭再打开终端或重启 VS CodeRemotion 预览白屏依赖没装全查看终端报错重新npm install首次渲染时 Chrome 下载失败网络问题查看渲染日志重新执行渲染命令行让它重试视频里没有声音组件里没有引入音频检查 Remotion 的Audio组件用AudiostaticFile引入音轨批量任务中途卡住某个素材不存在或多个进程端口冲突查看输出目录和日志分小批渲染加日志和失败重试最常见的问题集中在环境变量失效和模型名写错。建议把环境变量写进 shell 的配置文件而不是每次临时 export模型名以供应商文档为准不要从网上复制一个就拿过来用。10. 最佳实践与使用建议第一第一次跑通时不要追求复杂效果。先渲染一个最简单的“圆角矩形从透明到显示”的模板确认整条链路可用再逐步加字幕、图片、转场。这条建议能帮你把“项目配置问题”和“效果设计问题”分开定位。第二保持项目结构清晰。每个场景单独拆成一个组件Root.tsx只做注册渲染参数通过 props 传入。这样 Claude Code 改文件时改动范围更小不容易改坏其他模块。第三把有效的 prompt 存进项目仓库。Claude Code 的上下文是有限的如果用交互模式做了很多次修改历史记录会变长。建议写一个PROMPTS.md把常用的模板修改指令保存下来下次直接复制使用遇到上下文太长时用/clear清空再基于PROMPTS.md重新描述。第四批量任务要加日志和失败重试。渲染 100 条视频时任何一条出错都可能中断流程。脚本里建议记录每一条的渲染状态并设置失败后重试 2 次的逻辑。第五版权和授权问题必须放在第一位。做模板复刻或者风格复刻时不要直接使用未授权的影视画面、音乐、人脸肖像或品牌标志。演示素材用自己拍摄的画面或免版权素材音频用自己合成或明确授权的内容。如果涉及声音克隆、数字人、换脸类功能更需要确认被克隆者已签署授权协议且只在安全边界内做技术验证。第六接口服务要注意访问控制。如果把渲染能力封装成 API 服务并放在公网一定要加身份校验只允许可信的调用方访问避免被刷量或滥用。11. 总结与下一步这个组合最值得尝试的点是把“剪辑”完全从时间轴的拖动中解放出来。Claude Code 负责用自然语言生成和调整代码Remotion 负责把代码变成视频两者结合之后你得到的是一个可复用、可批量、可接口化的视频生产工具链。建议你最先验证一个 5 秒的文字动画模板从创建项目到渲染出 MP4 应该不超过半小时。最容易踩的坑有三个环境变量没加载导致模型连不上、首次渲染时 Chrome Headless 下载慢、批量脚本缺少日志导致出错难定位提前避开就好。后续可以扩展的方向很多接入 TTS 引擎给视频生成配音配合 OCR 工具把图文内容自动转成视频字幕或者做一个定时任务每天早上抓取一份内容数据自动渲染成固定风格的短视频。这套组合的上限取决于你愿意把多少视频生产逻辑抽象成代码。建议收藏备用动手时从最小的模板开始。