Integrate Rive into your Nuxt application.
This library allows full control over Rive files with a high-level API for hooking up many simple interactions and animations, as well as a low-level API that allows you to drive your own render loop to create multiple artboards, animations, and state machines all in one canvas.
✨ Release Notes
- 📦 Extendable by Nuxt modules
- 🚀 Supports Nuxt 3 / Rive
Rive is a real-time interactive design and animation tool that helps teams create and run interactive animations anywhere. Designers and developers use our collaborative editor to create motion graphics that respond to different states and user inputs. Our lightweight open-source runtime libraries allow them to load their animations into apps, games, and websites.
🏡 Homepage
- Add
nuxt-rive
dependency to your project
# Using pnpm
pnpm add -D nuxt-rive
# Using yarn
yarn add --dev nuxt-rive
# Using npm
npm install --save-dev nuxt-rive
- Add
nuxt-rive
to themodules
section ofnuxt.config.ts
export default defineNuxtConfig({
modules: [
'nuxt-rive'
]
})
That's it! You can now use Nuxt-Rive in your Nuxt app ✨
- Install dependencies with
pnpm
. - Run
pnpm dev:prepare
to generate stubbeddist
directory. - Make your changes.
- Run
pnpm lint
to verify that there is no issues (consider adding tests). - Submit a PR.
This repository is licensed under the MIT License. Feel free to use the code and modify it according to your needs.