auto-animate
✓Zero-Config-Animationen für React, Vue, Solid, Svelte, Preact mit @formkit/auto-animate (3,28 KB). Verhindert mehr als 10 dokumentierte Fehler: SSR/Next.js-Importe, bedingte Eltern, fehlende Schlüssel, Flexbox-Breite, Tabellenanzeige, Jest/esbuild-Konfiguration, CSS-Positionskonflikte, Vue/Nuxt-Registrierung, Angular ESM. Verwendung bei: Animieren von Listen/Akkordeons/Toasts/Formularen, Beheben von SSR-Animationsfehlern, Bedarf zugängliche Animationen (automatisch bevorzugt-reduzierte Bewegung) oder Drop-In-Übergänge ohne Bewegungsaufwand wünschen.
Installation
SKILL.md
Package: @formkit/auto-animate@0.9.0 (Sept 2025) Frameworks: React, Vue, Solid, Svelte, Preact Last Updated: 2025-11-22
Why this matters: Prevents Issue #1 (SSR/Next.js import errors). AutoAnimate uses DOM APIs not available on server.
Issue #1: SSR/Next.js Import Errors Error: "Can't import the named export 'useEffect' from non EcmaScript module" Source: https://github.com/formkit/auto-animate/issues/55 Why It Happens: AutoAnimate uses DOM APIs not available on server Prevention: Use dynamic imports (see templates/vite-ssr-safe.tsx)
Zero-Config-Animationen für React, Vue, Solid, Svelte, Preact mit @formkit/auto-animate (3,28 KB). Verhindert mehr als 10 dokumentierte Fehler: SSR/Next.js-Importe, bedingte Eltern, fehlende Schlüssel, Flexbox-Breite, Tabellenanzeige, Jest/esbuild-Konfiguration, CSS-Positionskonflikte, Vue/Nuxt-Registrierung, Angular ESM. Verwendung bei: Animieren von Listen/Akkordeons/Toasts/Formularen, Beheben von SSR-Animationsfehlern, Bedarf zugängliche Animationen (automatisch bevorzugt-reduzierte Bewegung) oder Drop-In-Übergänge ohne Bewegungsaufwand wünschen. Quelle: ovachiever/droid-tings.
Fakten (zitierbereit)
Stabile Felder und Befehle für KI/Such-Zitate.
- Installationsbefehl
npx skills add https://github.com/ovachiever/droid-tings --skill auto-animate- Quelle
- ovachiever/droid-tings
- Kategorie
- </>Entwicklung
- Verifiziert
- ✓
- Erstes Auftreten
- 2026-02-01
- Aktualisiert
- 2026-02-18
Schnelle Antworten
Was ist auto-animate?
Zero-Config-Animationen für React, Vue, Solid, Svelte, Preact mit @formkit/auto-animate (3,28 KB). Verhindert mehr als 10 dokumentierte Fehler: SSR/Next.js-Importe, bedingte Eltern, fehlende Schlüssel, Flexbox-Breite, Tabellenanzeige, Jest/esbuild-Konfiguration, CSS-Positionskonflikte, Vue/Nuxt-Registrierung, Angular ESM. Verwendung bei: Animieren von Listen/Akkordeons/Toasts/Formularen, Beheben von SSR-Animationsfehlern, Bedarf zugängliche Animationen (automatisch bevorzugt-reduzierte Bewegung) oder Drop-In-Übergänge ohne Bewegungsaufwand wünschen. Quelle: ovachiever/droid-tings.
Wie installiere ich auto-animate?
Öffnen Sie Ihr Terminal oder Kommandozeilen-Tool (Terminal, iTerm, Windows Terminal, etc.) Kopieren Sie diesen Befehl und führen Sie ihn aus: npx skills add https://github.com/ovachiever/droid-tings --skill auto-animate Nach der Installation wird der Skill automatisch in Ihrer KI-Programmierumgebung konfiguriert und ist bereit zur Verwendung in Claude Code oder Cursor
Wo ist das Quell-Repository?
https://github.com/ovachiever/droid-tings
Details
- Kategorie
- </>Entwicklung
- Quelle
- skills.sh
- Erstes Auftreten
- 2026-02-01