auto-animate

SKILL.md

Package: @formkit/auto-animate@0.9.0 (current) Frameworks: React, Vue, Solid, Svelte, Preact Last Updated: 2026-01-21

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)

@formkit/auto-animate를 사용한 React, Vue, Solid, Svelte, Preact용 제로 구성 애니메이션(3.28kb). React 19 StrictMode 버그, SSR 가져오기, 조건부 상위, 뷰포트 문제, 드래그 앤 드롭 충돌, CSS 변환 버그를 포함하여 15개의 문서화된 오류를 방지합니다. 사용 시기: 목록/아코디언/토스트 애니메이션, SSR 애니메이션 오류 문제 해결, React 19 StrictMode 문제 또는 자동 선호 감소 모션을 사용하여 액세스 가능한 드롭인 전환이 필요한 경우. 출처: jezweb/claude-skills.

원본 보기