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