M
motion
Use when adding animations with Motion Vue (motion-v) - provides motion component API, gesture animations, scroll-linked effects, layout transitions, and composables for Vue 3/Nuxt
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Use when adding animations with Motion Vue (motion-v) - provides motion component API, gesture animations, scroll-linked effects, layout transitions, and composables for Vue 3/Nuxt
How to use
- Zainstaluj Motion Vue za pomocą menedżera pakietów: dla Vue 3 uruchom
pnpm add motion-v, dla Nuxt 3 uruchompnpm add motion-v @vueuse/nuxt. - Jeśli używasz Nuxt 3, skonfiguruj moduł w pliku
nuxt.config.ts, dodającmotion-v/nuxtdo tablicymodulesw konfiguracji. - Określ, co chcesz animować: jeśli pracujesz z komponentem Motion i gestami, załaduj referencję dla komponentów; jeśli używasz composables takie jak
useMotionValuelubuseScroll, załaduj referencję dla composables; jeśli szukasz gotowych wzorców, załaduj przykłady animacji. - Zdefiniuj animacje deklaratywnie w szablonie Vue — użyj komponentu Motion do prostych animacji fade, slide czy scale, lub composables do bardziej zaawansowanych efektów.
- Dodaj interakcje oparte na gestach (hover, tap, drag) bezpośrednio w szablonie, korzystając z wbudowanego API Motion Vue.
- Testuj animacje w przeglądarce — biblioteka jest zoptymalizowana pod kątem wydajności dzięki przyspieszeniu sprzętowemu.