·auto-animate
</>

auto-animate

jezweb/claude-skills

@formkit/auto-animate を使用した React、Vue、Solid、Svelte、Preact のゼロ構成アニメーション (3.28kb)。 React 19 StrictMode のバグ、SSR インポート、条件付き親、ビューポートの問題、ドラッグ アンド ドロップの競合、CSS 変換のバグを含む 15 件の文書化されたエラーを防止します。 リスト/アコーディオン/トーストのアニメーション化、SSR アニメーション エラーのトラブルシューティング、React 19 StrictMode の問題、または自動優先モーションを使用したアクセス可能なドロップイン トランジションが必要な場合に使用します。

360インストール·7トレンド·@jezweb

インストール

$npx skills add https://github.com/jezweb/claude-skills --skill 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。

原文を見る

引用可能な情報

AI/検索での引用用の安定したフィールドとコマンド。

インストールコマンド
npx skills add https://github.com/jezweb/claude-skills --skill auto-animate
カテゴリ
</>開発ツール
認証済み
初回登録
2026-02-01
更新日
2026-02-18

クイックアンサー

auto-animate とは?

@formkit/auto-animate を使用した React、Vue、Solid、Svelte、Preact のゼロ構成アニメーション (3.28kb)。 React 19 StrictMode のバグ、SSR インポート、条件付き親、ビューポートの問題、ドラッグ アンド ドロップの競合、CSS 変換のバグを含む 15 件の文書化されたエラーを防止します。 リスト/アコーディオン/トーストのアニメーション化、SSR アニメーション エラーのトラブルシューティング、React 19 StrictMode の問題、または自動優先モーションを使用したアクセス可能なドロップイン トランジションが必要な場合に使用します。 ソース: jezweb/claude-skills。

auto-animate のインストール方法は?

ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/jezweb/claude-skills --skill auto-animate インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります

ソースリポジトリはどこですか?

https://github.com/jezweb/claude-skills