rive-web
✓在以下情况下触发：(1) 在网络上加载或嵌入 .riv 文件， (2) 使用@rive-app/canvas 或@rive-app/webgl 包， (3) 从 JavaScript 控制 Rive 状态机， (4) 读/写 Rive 输入或处理事件， (5) 用户在网络上下文中提及“Rive 运行时”或“Rive 动画”。 在网络上嵌入和控制 Rive 动画的最佳实践 使用官方 Rive JavaScript/TypeScript 运行时。
SKILL.md
Embed and control Rive animations on the web with JavaScript/TypeScript.
| Rive Instance | Main controller for the animation | | State Machine | Interactive logic built in Rive editor | | Inputs | Variables to control state machine (Boolean, Number, Trigger) | | Events | Signals fired by the state machine | | Artboard | Container for animation content |
@file rules/loading.md @file rules/state-machines.md @file rules/inputs.md
在以下情况下触发：(1) 在网络上加载或嵌入 .riv 文件， (2) 使用@rive-app/canvas 或@rive-app/webgl 包， (3) 从 JavaScript 控制 Rive 状态机， (4) 读/写 Rive 输入或处理事件， (5) 用户在网络上下文中提及“Rive 运行时”或“Rive 动画”。 在网络上嵌入和控制 Rive 动画的最佳实践 使用官方 Rive JavaScript/TypeScript 运行时。 来源：stevysmith/rive-skills。
可引用信息
为搜索与 AI 引用准备的稳定字段与命令。
- 安装命令
npx skills add https://github.com/stevysmith/rive-skills --skill rive-web- 分类
- *创意媒体
- 认证
- ✓
- 收录时间
- 2026-02-01
- 更新时间
- 2026-02-18
快速解答
什么是 rive-web？
在以下情况下触发：(1) 在网络上加载或嵌入 .riv 文件， (2) 使用@rive-app/canvas 或@rive-app/webgl 包， (3) 从 JavaScript 控制 Rive 状态机， (4) 读/写 Rive 输入或处理事件， (5) 用户在网络上下文中提及“Rive 运行时”或“Rive 动画”。 在网络上嵌入和控制 Rive 动画的最佳实践 使用官方 Rive JavaScript/TypeScript 运行时。 来源：stevysmith/rive-skills。
如何安装 rive-web？
打开你的终端或命令行工具（如 Terminal、iTerm、Windows Terminal 等） 复制并运行以下命令：npx skills add https://github.com/stevysmith/rive-skills --skill rive-web 安装完成后，技能将自动配置到你的 AI 编程环境中，可以在 Claude Code 或 Cursor 中使用
这个 Skill 的源码在哪？
https://github.com/stevysmith/rive-skills