Ajouter Fougere à une app Nuxt existante
Fougere ajoute sa couche modèle à l'app existante. Le routing, les pages, les composants,
le style et les routes serveur restent en place. Le module enregistre uniquement ses
propres chemins : /_fougere/call
(l'enveloppe), /api/{frond}/… (surface REST) et /auth/**
si vous activez l'auth.
Les trois pièces
1. Le module — dans votre nuxt.config.ts existant :
export default defineNuxtConfig({
modules: [/* vos modules */, '@fougere/nuxt'],
});
2. La config — fougere.config.ts à la racine
(référence complète) :
import { defineFougere } from '@fougere/core';
export default defineFougere({
db: { dialect: 'sqlite', path: '.data/app.db' },
});
3. Une première Frond — une entité et un handler, à la racine de l'app que vous avez déjà :
entities/Todo.ts
handlers/TodoHandler.ts
Le scanner reconnaît ces deux fichiers grâce à la convention utilisée à la racine du
projet (la forme à plat).
Une page écrit
import Todo from '@frond/<nom-de-votre-paquet>/entities/Todo' — le module enregistre cet
alias depuis le scan, donc il n'y a ni package.json ni entrée pnpm-workspace.yaml à
ajouter. Un deuxième domaine ira plus tard dans fronds/billing/, et ces deux fichiers ne
bougent pas.
Lancez pnpm dev et vérifiez le log : scanned 1 frond(s).
Migrer feature par feature
Prenez une fonctionnalité à la fois ; les anciennes routes continuent de servir le reste. Les éléments suivants ont un équivalent Fougere :
| Ce que vous maintenez aujourd'hui | Ce que ça devient |
|---|---|
| un schéma Zod/Yup | les champs de l'entité — axe shape |
| une définition de table ou une migration additive | dérivée — auto-DDL additif depuis les mêmes champs ; les changements destructifs restent explicites |
server/api/todos.post.ts + appel de validation | une opération de handler, validée à la façade |
| l'état du formulaire + règles côté client | useFormFor(Todo) — même validation que le serveur |
useFetch('/api/todos') + comptabilité de refresh | useQuery(Todo, 'list') — revalidée par les commands |
Supprimez les originaux à chaque feature migrée — le but est d'avoir moins de fichiers à synchroniser, pas une copie parallèle.
Ce qui reste à vous
- Pages et composants — les primitives sont additives ; pas de layout, pas de widgets.
- Les autres routes serveur — tout ce qui est hors des chemins revendiqués est intact.
- L'auth — optionnelle. Gardez votre système si vous en avez un ;
useCurrentUseret le flux session→handler demandent l'auth Fougere activée.
Limites actuelles
- Les paquets sont sur npm sous le tag
alpha— le numéro de version est toute la promesse. - Le storage est SQLite auto-DDL (Kysely dessous). La table d'une entité appartient à Fougere — migrez une feature quand vous pouvez lui confier son storage, gardez votre accès base existant pour le reste.
Suite : La CLI — composer un workspace, héberger une Frond, appeler une opération.
Un autre hôte ?
Cette page parle de Nuxt parce que son module fait le montage à votre place. La même Frond tourne sous Next, TanStack Start, React Router, SvelteKit et Express — trois d'entre eux n'ont besoin d'aucun paquet Fougere. Voir Hôtes.