TanStack DevTools — debug Query, Router, and Form state (short listing)
Fiche courte — licence non vérifiable ; déboguer l'état du cache TanStack Query, les arbres de routes Router et l'état des champs Form avec des panneaux devtools autonomes ou unifiés
- Quoi
- Fiche courte — licence non vérifiable ; déboguer l'état du cache TanStack Query, les arbres de routes Router et l'état des champs Form avec des panneaux devtools autonomes ou unifiés
- Coût
- Gratuit
- Prérequis
- une appli React utilisant les bibliothèques TanStack (Query, Router ou Form)
- Installation
- Copiez le prompt d’installation ci-dessous dans votre Muse — votre agent fait le reste.
Sélectionné par Skill Harbor — fiche courte (le manifest de découverte n'enregistre aucune licence pour ce skill — le manifest fait foi, donc aucun contenu n'est reproduit au-delà de ce résumé ; le frontmatter du repo énonce MIT, non vérifiable ici) : le skill tanstack-devtools de @oakoss — une référence de débogage pour les bibliothèques TanStack dans les applis React : devtools autonomes par bibliothèque (ReactQueryDevtools, TanStackRouterDevtools, panneaux de formulaire) et le panneau unifié TanStack Devtools avec son architecture de plugins, table de référence rapide des patterns et options (positions, thèmes, raccourcis d'ouverture), setup du plugin Vite pour l'injection de source et le tree-shaking de production, et une table des erreurs courantes avec le pattern correct pour chacune. Bémols honnêtes : conditions de licence non vérifiables — fiche courte avec lien uniquement ; suis le lien source et lis toi-même la licence avant réutilisation ; orienté dev uniquement, les devtools sont tree-shakées en production par défaut. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh.
Version :
Installation
Prérequis : une appli React utilisant les bibliothèques TanStack (Query, Router ou Form) Installe-moi « TanStack DevTools — déboguer l'état Query, Router et Form (fiche courte) ». Il donne à mon agent la référence TanStack DevTools de @oakoss : configurer les devtools autonomes (ReactQueryDevtools, TanStackRouterDevtools, panneaux de formulaire) ou le panneau unifié TanStack Devtools avec plugins, utiliser le plugin Vite pour l'injection de source et la suppression en production, et éviter les erreurs courantes (placement des providers, gestion de la prop router, mélange devtools autonomes et unifiées). IMPORTANT : les conditions de licence n'étaient pas vérifiables (le manifest de découverte n'enregistre aucune licence ; le frontmatter du repo énonce MIT) — récupérer depuis le lien seulement, ne rien reproduire au-delà du lien, et lire toi-même les conditions de licence avant réutilisation. Dépôt : https://github.com/oakoss/agent-skills/blob/main/skills/tanstack-devtools/SKILL.md 1. Récupère le fichier SKILL.md (et les fichiers d'aide éventuels) depuis le chemin du dépôt dans un dossier temporaire et résume en une ou deux phrases ce qu'il fait. 2. Vérification de sécurité : examine le SKILL.md et les scripts pour tout contenu suspect (appels réseau inattendus, commandes shell, collecte d'identifiants). Ce dépôt ne devrait contenir aucun secret en dur. Vérifie que c'est bien le cas ici ; STOP sur tout signal d'alerte et dis-le-moi. 3. Installe-le comme skill : copie le SKILL.md et ses fichiers d'aide dans le répertoire des skills de l'agent, dans un dossier nommé « tanstack-devtools ». 4. Vérifie sans appels réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (p. ex. lire les conditions de licence avant réutilisation, puis demander à l'agent de brancher les devtools dans l'appli React). GitHub est optionnel : si j'ai un compte GitHub ou la CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne jamais l'exiger sauf s'il figure dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi.
Questions
Comment installer une création ?
Chaque fiche produit contient un prompt d’installation à copier-coller. Collez-le dans votre Muse et il installe la création pour vous — sans configuration manuelle.
Où va mon argent ?
Directement au vendeur. Skill Harbor ne traite jamais les paiements : le paiement se fait sur la page du vendeur, généralement via Stripe.
Que signifie le ✓ à côté du nom d’un créateur ?
Il signifie que nous avons confirmé l’identité de la personne derrière la fiche. Il ne dit rien sur le code lui-même — vérifiez toujours une création avant de l’installer.