迁移指南(Migration Guides)
本页将 React Runtime 的多个迁移说明合并到一个页面中,便于集中查阅。
从 v3.x.x 迁移到 v4.x.x
从 v4 开始,React Runtime 支持运行时 Rive Text。
涉及包:
@rive-app/react-canvas@rive-app/react-webgl
主要变化
说明(Note):没有破坏性 API 变更。
虽然 API 未破坏,但由于底层 Web Runtime 依赖变化,包体积有所增加,因此进行了主版本升级。
如果你的场景不需要 Text 能力,官方未来可能提供更轻量的包;当前主包默认包含该能力。
从 v1.x.x 迁移到 v3.x.x
总体上,从 v1.x.x 升级到 v3.x.x 改动较少。
说明(Note):
v2.x.x -> v3.x.x通常可无改动迁移。
依赖变化
早期你可能安装:
npm i rive-react
后续推荐按渲染器拆分:
@rive-app/react-canvas(推荐默认)@rive-app/react-webgl(需要 WebGL 时)
npm i @rive-app/react-canvas
rive-react 仍会发布,但因同时依赖两套 runtime,包体可能更大。
Props 透传行为变化
RiveComponent 结构是「外层 div + 内层 canvas」。
从 v2 开始:
className/style→ 透传到外层<div>- 其他属性(如
aria-*)→ 透传到<canvas>
这让无障碍属性更容易直接落在 canvas 元素上。
从 v0.x.x 迁移到 v1.x.x
在 rive-react v1.0.0 之前,React Runtime 基于 @rive-app/canvas(CanvasRenderingContext2D)。
为支持后续高级绘制能力(如 Mesh Deformations),v1 内部改为基于 @rive-app/webgl。
迁移影响
- 无破坏性 API 变更
- 主要是底层渲染上下文切换为 WebGL
如果升级后遇到问题,请反馈到: