Vite build-tool patterns: config, plugins, HMR, env, library mode
Patterns Vite 8+ — config, tables de plugins, API HMR, env et proxy, pièges de sécurité, mode bibliothèque, optimisation du build — rédigé en japonais
- Quoi
- Patterns Vite 8+ — config, tables de plugins, API HMR, env et proxy, pièges de sécurité, mode bibliothèque, optimisation du build — rédigé en japonais
- Coût
- Gratuit
- Prérequis
- un projet Vite (vite.config.ts ou équivalent) ; tooling Node.js ; rien d'autre — le skill est des patterns plus des exemples de code, aucun compte ni clé requis
- Installation
- Copiez le prompt d’installation ci-dessous dans votre Muse — votre agent fait le reste.
Sélectionné par Skill Harbor — les patterns de l'outil de build et du serveur de développement Vite 8+ de @affaan-m : comment le mode dev (ESM natif, transformations à la demande) et le mode build (Rolldown v7+ ou Rollup v5–6 avec tree-shaking, code-splitting, minification Oxc) diffèrent ; structure de config avec configs conditionnelles et tables d'options clés (root, base, envPrefix, build.outDir/minify/sourcemap) ; table des plugins essentiels (React SWC/Babel, Vue, vite-plugin-checker — car `vite build` transpile mais ne type-check jamais — vite-tsconfig-paths, vite-plugin-dts, vite-plugin-svgr, rollup-plugin-visualizer, vite-plugin-pwa) plus squelette de plugin custom avec hooks clés ; l'API HMR (`import.meta.hot`, muter data au lieu de réassigner, tout tree-shaké hors production) ; variables d'env (ordre de chargement, exposition client `VITE_`, usage côté config via loadEnv) ; section sécurité (le préfixe `VITE_` n'est pas une frontière de sécurité — tout ce qui est préfixé fuite dans le bundle livré ; le piège `loadEnv('', ...)` ; sourcemaps de production ; checklist `.gitignore`) ; patterns de proxy serveur ; optimisation du build (manualChunks en forme objet/fonction, éviter les barrel files, extensions d'import explicites, warmup clientFiles, `vite --profile` + profiling Speedscope) ; mode bibliothèque (`build.lib`, les deux pièges — pas de sortie de types, les peer deps doivent être externalisées) ; externalisation SSR ; pré-bundling des dépendances ; et pièges courants (divergence CJS dev/build, hash de chunks périmés, `host: true` sous Docker, `fs.allow` en monorepo). Bémols honnêtes : **le skill est rédigé en japonais** (dossier `docs/ja-JP/`) ; Vite évolue vite — vérifiez les noms de plugins sur vite.dev pour votre version ; licence MIT. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh.
Version :
Installation
Prérequis : un projet Vite (vite.config.ts ou équivalent) ; tooling Node.js ; rien d'autre — le skill est des patterns plus des exemples de code, aucun compte ni clé requis Installe-moi « Patterns de l'outil de build Vite : config, plugins, HMR, env, mode bibliothèque ». Il donne à mon agent les patterns Vite 8+ de @affaan-m : modes dev vs build, structure de config et tables d'options clés, table des plugins essentiels (plus le gap de type-check que vite-plugin-checker comble), l'API HMR, gestion des variables d'env, pièges de sécurité (le préfixe VITE_ n'est pas une frontière de sécurité, le piège loadEnv(''), les sourcemaps de production), proxy serveur, optimisation du build (manualChunks, éviter les barrel files, warmup, profiling), mode bibliothèque avec ses deux pièges, externalisation SSR, pré-bundling des dépendances, et pièges courants avec leurs correctifs. Rédigé en japonais ; licence MIT. Dépôt : https://github.com/affaan-m/ecc/blob/main/docs/ja-JP/skills/vite-patterns/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, les identifiants uniquement via le coffre sécurisé, les hôtes autorisés déclarés dans le SKILL.md. 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é « vite-patterns ». 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. rien — c'est une référence ; pointez l'agent vers votre vite.config.ts pour déboguer ou optimiser). 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.