Skip to main content

Remotion 3.2

· 6 min read
Jonny Burger
Remotion首席黑客

在这个版本中:创建视频的方式更多,工作流程更好!

Lottie支持

宣布官方 @remotion/lottie 包,包括 类型安全组件 和详尽的 文档。 使用 Lottie,您可以从 LottieFiles 导入成千上万的预制动画,我们甚至制作了一个指南,介绍了 如何导入在After Effects中创建的动画

在Remotion中嵌入的Lottiefiles动画:1, 2, 3

要开始,请将 @remotion/lottie 安装到您的Remotion项目中,并导入 <Lottie> 组件:

bash
npm i @remotion/lottie
bash
npm i @remotion/lottie

感谢 Arthur Denner 实现了这个功能!

React Native Skia支持

使用 @remotion/skia 包,您现在可以在Remotion中使用 React Native Skia!感谢我们的合作者 William CandillonChristian Falch,Remotion现在是React Native Skia的一流目标。

查看史诗公告视频阅读文档 并使用以下内容制作您的第一个视频:

bash
npx create-video --skia
bash
npx create-video --skia

可缩放的时间轴

我们的时间轴具有一些新功能,使其更像传统视频编辑器。您现在可以放大和缩小时间轴,以更好地专注于视频的某个部分。播放视频时,时间轴会随着光标移动。使用光标或键盘进行快进也会滚动时间轴,使光标始终在视口内。

另一个新的时间轴功能是现在每秒会出现刻度线,当放大时,会出现表示单帧位置的较小刻度线。这应该有助于您确定自己在视频的哪个时间点。

音频和视频渲染的改进

现在,您可以通过在渲染中传递 --muted 来明确删除视频的音频。现在,不包含音频的视频渲染速度更快,因为我们不再包含静音音轨(使用 --enforce-audio-track 来获得旧行为)。

现在,仅音频渲染速度更快,因为 Remotion 不会等待视频标签进行定位。

现在,仅视频渲染速度更快,因为不需要下载任何资产以包含在音频轨道中。

便捷功能

  • 现在,预览中的后退和前进按钮可以正常工作。
  • Remotion Lambda 现在可用 Chrome 104,这意味着您可以使用便捷的转换快捷方式
  • 您现在可以在 Remotion Lambda 上渲染 ProRes。
  • 如果您正在渲染到禁用 ACL 功能的存储桶,则 Remotion Lambda 现在具有 privacy: "no-acl" 选项。
  • Remotion Lambda 现在支持 downloadBehavior 属性,使得在浏览器中单击输出文件链接时,它将下载而不是在浏览器中播放。
  • 不再需要向 npx remotion render 命令添加输出文件名,现在默认为 out/{composition-id}.{extension}
  • <Player> 现在具有新的 moveToBeginningWhenEnded 属性,确定视频到达结尾且不循环时播放器是否返回到开头。
  • <Player> 现在具有新的 fullscreenchange 事件,允许您
  • 您现在可以为 <Player> 分配一个 className

开发者体验

  • 新的 ESLint 规则,如果您将相对路径或远程 URL 传递给 staticFile,则会发出警告:staticFile("../my-file.png")staticFile("https://example.com")
  • 在 Remotion Lambda 上更好的错误消息,当您渲染到的存储桶缺少 s3:ListBucket 权限时。
  • 当将以 .gif 结尾的文件传递给 <Img> 组件时,ESLint 会发出警告。
  • 更好的错误消息和帮助页面,当在另一个无服务器函数中调用 renderMediaOnLambda() 且 AWS 凭证发生冲突时。
  • 更好的错误消息和帮助页面,当渲染到一个 ACL 已禁用但您将隐私设置为 publicprivate 的存储桶时。

显著的错误修复

  • <Player> 现在在 React 18 严格模式下可以正常工作。
  • 预览服务器不应再在任何情况下崩溃。
  • Remotion 现在会清理任何临时创建的文件,不会污染硬盘。
  • 在项目根目录之外执行 npx remotion 命令现在可以正常工作。
  • 如果未安装 code 命令,则 Open in VS Code 现在可以正常工作。
  • 当使用 <Video> 时,Remotion Lambda 现在使用的内存更少,更不容易崩溃。

内部

  • CLI 配置代码已从 remotion 移动到 @remotion/cli,使 remotion 包减小了 30%。
  • 我们从某些包中的 jest 迁移到了 vitest
  • puppeteer-corechalk 依赖已内联。
  • 我们采用了 Node.JS Corepack。