前言
以前我一直觉得,视频创作是一件门槛很高的事情。
剪辑要学 PR,动画要学 AE,想做出稍微高级一点的转场和特效,还得研究关键帧、时间轴和各种插件。很多时候一个几秒钟的动画效果,调参数的时间比真正制作的时间还长。
后来 AI 开始进入视频领域。
最开始我以为它只是帮忙写文案、生成配音或者做字幕,直到接触 Remotion 之后才发现,视频制作这件事可能真的要变天了。
Remotion 有一个非常大胆的理念:
视频不是剪出来的,而是写出来的。
传统剪辑软件依赖时间轴和轨道,而 Remotion 直接把视频当成网页来开发。文字、图片、动画、转场甚至整个分镜逻辑,都可以通过 React 代码进行控制。理论上只要浏览器能够实现的效果,都能够被制作成视频。
如果故事到这里结束,那么 Remotion 依然只是开发者的玩具。
真正让我觉得离谱的是 Codex。
以前想用 Remotion,至少还得懂 React 和 JavaScript。现在有了 Codex 之后,你甚至可以直接告诉 AI:
帮我做一个 cpolar 宣传视频。
然后让它自动编写分镜、动画和页面逻辑,最后生成能够直接渲染的视频项目。整个过程更像是在和一个视频导演聊天,而不是写代码。
1 什么是 Remotion?

Github 上拥有 44k+ 星的 Remotion,并不是简单的在线剪辑工具,而是一场关于视频生产范式的革命。Remotion 是一个可以使用 React 编写 Video 的框架。它的核心逻辑就是把每一帧视作为网页的一个页面来处理。利用HTML、CSS、JS渲染技术以及结合了视频编码的技术之后,就可以用上Web生态里所有的强大能力(Canvas、SVG、WebGL、Lottie),从而制作出动画效果。也就是说,只要浏览器能实现的效果都可以被"转化"成视频形式存在。
Remotion的核心特性:
- 视频即代码(Video as Code): 基本上取消了传统非线性编辑器中轨道逻辑的存在,用 HTML、CSS、JavaScript 以及完整的 React 生态系统来构建每一帧画面。
- 参数化大规模生产:类似调用函数一样给视频传参。支持使用JSON或者API来实时驱动视频内容,从而达到"一套模板、万人万面"的个性化自动化生成效果。
- 像素级精准控制: 借助 Web 动画强大的精度,在 60 FPS 的帧率下精确捕捉到每一毫秒的动画效果,避免了传统软件中繁复的关键帧提取过程。
- Git 版本化管理: 视频工程文件不再是难以理解的二进制包,而是清晰明了的代码行。支持团队协作、代码审查(Code Review)和完美的分支控制。
- 分布式云端渲染:原生支持AWS Lambda的分布式渲染,可以把渲染任务分发到上千个云节点上并行处理,把渲染耗时从"小时级"压缩至"秒级"。
- 无缝对接 AI 生态:由于其纯代码的特性,可以和 Codex、Cursor 等 AI 编程工具完美结合。只需要描述逻辑就可以生成复杂的视频组件了,大大降低了技术门槛。
2 安装基础环境
2.1 Node.js环境
在使用Remotion之前,我们需要确保电脑上已经安装了Node.js环境。推荐用nvm来装node.js,NVM是一个Node.js版本控制器,在这个包里可以很容易地切换不同版本的Node.js。首先打开nvm官方GitHub仓库当前最新版本1.2.2发布页面:
shell
https://github.com/coreybutler/nvm-windows/releases/tag/1.2.2

下载之后,双击运行启动安装程序【nvm-setup.exe】,再同意协议后点击下一步即可

来到选择安装目录,这里选择【D:\nvm】,将nvm安装在D盘中,然后继续点击【Next】:

接着设置nodejs的下载位置,这里直接也选择下载在nvm文件夹中,继续点击【Next】:

接下来,一路选择【Next】即可,过程中的复选框及邮箱地址都可以不用修改和输入,直到最后一步点击【install】即可:

安装完毕后,回到刚才设置nvm的地方【D:\nvm】双击打开settings.txt文件,在其中粘贴下面的代码之后按下Ctrl+S保存:
tex
node_mirror: https://npmmirror.com/mirrors/node/
npm_mirror: https://npmmirror.com/mirrors/npm/
该地址为国内淘宝镜像源,添加之后可以更快地下载nodejs环境:

接下来,电脑上按【Win+R】键打开运行窗口,在里面输入cmd并回车即可打开命令提示符(CMD)窗口;然后在CMD中依次执行以下操作以查看版本是否安装:
shell
nvm -v

然后依次输入以下命令来安装nodejs环境(需要22版本以上)并且启用该版本:
shell
nvm install 22
nvm use 22.20.0
node -v
npm -v
安装完毕后,用该版本进行验证,并且确认node环境的版本是否有效果,如上图所示:

Node.js 安装完成之后,可以使用 nvm 管理器来安装并切换不同的 Node.js 版本。
2.2 安装FFmpeg
访问 FFmpeg 官方推荐的 Windows 编译版本网站:
shell
https://www.gyan.dev/ffmpeg/builds/
如下图:

在 "release builds" 栏目下,找到 ffmpeg-release-essentials.zip进行下载,下载下来后,将压缩包解压重命名一下:

把图放在的位置是【C:\softwares\ffmpeg-8.0】,然后按住Win键再按下R组合键,在打开的对话框中输入下面命令:
shell
control sysdm.cpl,,3
如下图:

配置完成后,在cmd中验证版本:
shell
ffmpeg -version

可以发现已经输出了版本信息,这就完成了安装
3 Windows 本地环境实战:从零拉取你的第一个视频项目
想要在本地"写"视频的第一步不是学代码,而是把这台"视频工厂"搬进你的 Windows 电脑。使用 Remotion 超好的脚手架工具的话,在安装大剪辑软件之前的时间会短很多。
3.1 初始化项目
首先,打开PowerShell或者CMDm(Win+X选择终端即可),输入下面这行神奇的代码:
shell
npx create-video@latest
如下图:

接着做一些基础配置操作,基本一路回车即可:

安装完毕后会问是否要使用VsCode打开项目,我们选择了Yes:
如果还没有安装Vscode编辑器的话,可以到官网下载:https://code.visualstudio.com/

打开后会询问是否信任此项目,选择信任即可:

3.2 安装Codex插件
在侧边栏,选择插件图标,然后搜索codex即可,选择codex插件进行安装:

安装完成后,应该会在左侧出现,可以调整刀自己喜欢的位置:

登录就不多说了,下面开始进行交流并启动项目。
3.3 启动项目
启动有两种方式,可以直接在终端中输入命令:
shell
npm install
npm run dev
如下图:

或者可以直接和它交流,让其为我们做分析并启动项目,我们直接对它说:
shell
分析一下当前项目,并且帮我启动它
如下图:

等待它跑完,查看输出结果:

可以看到它已经启动了,目前是空项目状态,请访问一下:
shell
http://localhost:3000
如下图:

可以成功访问到项目了,我们的项目也启动好了!
4 视频创作实操演示
直接与codex对话,由它用react代码给我们生成一个视频分镜脚本:
shell
当前项目my-video中,有一个.codex的skill 查看一下,然后根据其中的skill给我设计一个cpolar内网穿透的宣传视频分镜特效脚本,需要16:9的画面。

可以看到,提示词给出来后,它已经在执行任务了,还创建了视频分镜特效脚本,让我们等待任务完成。看到这里他出的是文字版,所以补了一句,让我们看看最终效果:

如下为GIF动图演示(做了加速处理):

怎么样,效果是不是还不错,每一帧都是由React代码生成的。如果觉得还不错,可以点击右下角的Render按钮,配置相关参数调整,然后进行导出:

点击导出后,右边会进行帧处理,如下图:

等待导出完成后,就可以得到一个可以直接播放的MP4格式的视频啦:

这样一来,我们便做了一段宣传视频了嘛?
5 下载安装cpolar
既然已经掌握了用Codex+Remotion高效生成视频的方法,那么就会遇到一个新的问题:既然这种"视频即代码"的模式如此强大,如果我想把本地运行的Remotion实时预览界面分享给远方的客户观看,又该怎么办?
本地运行的 localhost:3000 就像一座孤岛,不能直接被外网访问。
为了突破地域限制,达到真正的远程云端协作的效果,我们还需要用到另一款神器------cpolar。它是目前最强大的内网穿透工具之一,可以立刻为本地环境创建一个公网访问的"专属隧道"。接下来就是安装 cpolar 了,在这里彻底打通本地创作和远端演示之间的最后一公里距离。
5.1 什么是cpolar?

- cpolar 是一款内网穿透工具,可以将局域网内的服务(本地 Web 服务器、SSH、远程桌面等)通过一条安全加密的中间隧道映射到公网之上,使外部设备无需配置路由器就可以访问。
- 支持 Windows、macOS、Linux、树莓派、群晖 NAS 等平台,并且可以提供一键安装脚本方便部署。
5.2 下载安装cpolar
打开cpolar官网的下载页面
点击立即下载 64-bit按钮,然后就可以把安装包下载下来了

下来一下就是个压缩包,解压之后再运行里面的程序即可,默认安装就好,装完后打开CMD窗口输入下面的命令来验证是否已经成功安装好了:
shell
cpolar version

出现以上版本就代表安装成功
5.3 注册及登录cpolar web ui管理界面
访问cpolar官网,点击免费注册按钮进行账号注册

进入到如下的注册页面进行账号注册:

注册成功后,在浏览器中输入以下地址访问Web UI管理界面:
shell
http://127.0.0.1:9200

输入刚才注册好的cpolar账号登录就可以进入后台页面了:

6 穿透Remotion以实现公网访问
刚才我们已经成功地安装并登录了 cpolar,万事俱备只欠东风。接下来只需要把本地运行的 Remotion 服务(默认端口一般为3000或者顺延端口,在文中显示为3000)通过 cpolar 映射出去就可以立刻获得一个公网访问地址。
6.1 随机域名方式(免费方案)
随机域名的方式比较适合预算有限的用户。使用该方法时,系统会每隔24小时左右自动更换一次域名地址。不太友好地对待长期访问的人群,但是这个方案是免费提供的,如果您的资金允许的话,请参见大纲6.2中的固定域名的方法以及它所带来的一点小好处------就是更稳定的网页浏览体验。
首先,点击左侧菜单栏的【隧道管理】,展开进入【隧道列表】页面,在该页面下默认有两个隧道:
- 远程桌面隧道,指向3389端口,tcp协议
- 网站隧道指向8080端口,使用http协议(HTTP默认会生成两个公网地址,一个是http,另一个是https,省去了配置SSL证书的麻烦)

点击创建隧道,进入创建隧道页面,在这里填写一个【隧道名称】为【remotion】,本地地址处输入remotion的端口号3000,并选择一个地区为中国Top后点创建按钮:

创建完毕之后,在【状态】下的【在线隧道列表】里就可以看到我们新建的隧道已经在其中了:

以https为例,我们来测试一下:
shell
https://1ccad265.r1.cpolar.top

可以看到,成功访问到穿透之后的remotion页面了!
6.2 固定域名方式(升级任意套餐皆可)
上面的随机域名方案虽然可以免费使用,但是有一个绕不开的小问题就是每隔24小时就会自动刷新一次。这又意味着什么呢?你昨晚辛苦搭好的模型今天想发给甲方或者朋友看一眼炫耀一下结果发现地址失效了还要回到cpolar后台重新复制新地址来回折腾很不优雅。
如果你想要拥有一个永久固定、随时可用 的专属访问地址,比如 remotion.cpolar.top 这样的简洁好记的链接发给谁都能直接打开的话,只需要把 cpolar 升级到任意付费套餐,并配置一个固定的二级子域名就可以实现!操作也十分简单:
第一,进入官网预留页面:
shell
https://dashboard.cpolar.com/reserved
然后选择【预留】菜单,就可以看到其中的【保留二级子域名】项了,在里面填写好地区、名称以及描述(可以不填),最后点击一下保存按钮即可。操作步骤图如下:

列表里有一条被保留下来的二级子域名记录:
- 地区:China TOP。
- 二级域名为remotion。
二级域名为唯一,每个账号都不一样,请以自己所留的二级域名为主
保留成功之后,回到本地 cpolar 管理界面(http://127.0.0.1:9200),进入侧边菜单栏的【隧道管理】→【隧道列表】中找到之前创建好的 remotion 隧道:

点击右侧的【编辑】按钮,把域名类型 改为"二级子域名",在 Sub Domain 栏中输入你之前保存好的名称(例如 remotion),然后点一下 【更新】:

更新完成之后,接着进入【状态】→【在线隧道列表】就可以看到公网地址由之前随机字符串变成现在固定的二级子域名形式:

然后复制公网地址,在浏览器中直接输入你自己的固定地址来访问:

完美!页面一眨眼就打开了,感觉还是以前那样丝滑。一个永远不变的域名也设置好了
总结
Remotion 最大的价值,并不是替代 PR 或 AE,而是提供了一种全新的视频生产方式。通过代码描述画面,通过组件组织动画,通过数据驱动内容,让视频制作从"手工操作"逐渐转向"程序生成"。
而 Codex 的加入,则进一步降低了门槛。过去需要掌握 React、CSS 动画以及 Remotion API 才能完成的工作,现在很多时候只需要用自然语言描述需求,就能够让 AI 自动生成对应的视频逻辑和动画效果。对于不会编程的创作者来说,这种变化几乎是革命性的。
本文完成了 Node.js、FFmpeg、Remotion 项目的搭建,并通过 Codex 实现了视频分镜设计、动画生成以及最终渲染导出。同时借助 cpolar 打通公网访问能力,让本地运行的 Remotion 项目能够被远程访问和演示,进一步提升协作效率。
对于内容创作者、自媒体团队以及企业宣传场景来说,未来的视频制作未必一定发生在时间轴里。越来越多的工作可能会变成"描述需求 → AI生成 → 调整细节 → 导出视频"的流程。而 Codex 与 Remotion 的组合,正在把这种可能变成现实。