Flexweg CMS

Développement local

Cette page est pour les développeurs qui veulent faire tourner l'admin localement avec le hot module reload, écrire des plugins ou des thèmes contre le code admin live, ou contribuer au CMS lui-même.

Cette page est pour les développeurs qui veulent faire tourner l'admin localement avec le hot module reload, écrire des plugins ou des thèmes contre le code admin live, ou contribuer au CMS lui-même.

Si vous voulez juste faire tourner l'admin sans le modifier, le chemin sans build est plus rapide.

Prérequis

  • Node.js 20+ (le projet utilise des APIs Node modernes + les tests)
  • Git
  • Un projet Firebase + compte Flexweg configurés (comme pour le chemin sans build — voir vue d'ensemble de l'installation). En mode SQLite, le dev local pointe vers une instance Flexweg réelle ; il n'y a pas de stub SQLite local.

Cloner et installer

BASH
git clone https://github.com/<owner>/flexweg-cms.git
cd flexweg-cms
npm install --legacy-peer-deps

--legacy-peer-deps est requis

Le projet épingle TypeScript 6 (en cohérence avec le projet jumeau kanban), tandis que react-i18next déclare un peer optionnel sur TypeScript 5. Le peer est optionnel mais npm 7+ traite les peer ranges strictement par défaut. Le flag est sûr — l'install se termine correctement.

Si vous oubliez le flag vous aurez une erreur ERESOLVE. Re-lancez juste avec --legacy-peer-deps.

Configurer .env

Copiez l'exemple et remplissez vos identifiants Firebase :

BASH
cp .env.example .env

Éditez .env :

VITE_FIREBASE_API_KEY=AIza...
VITE_FIREBASE_AUTH_DOMAIN=monsite-cms.firebaseapp.com
VITE_FIREBASE_PROJECT_ID=monsite-cms
VITE_FIREBASE_STORAGE_BUCKET=monsite-cms.appspot.com
VITE_FIREBASE_MESSAGING_SENDER_ID=123456789012
VITE_FIREBASE_APP_ID=1:123456789012:web:abc123
[email protected]

Cette config est uniquement pour le mode Firebase. En mode SQLite, ne remplissez pas .env — l'admin passe toujours par le formulaire d'installation pour échanger la clé maître contre un token scopé.

Lancer l'admin en mode dev

BASH
npm run dev

Ouvre http://localhost:5173. L'admin se connecte à votre Firebase (ou affiche le formulaire d'installation en mode SQLite), vous vous connectez, et HMR fait son travail.

Commandes utiles

BASH
npm run typecheck    # tsc --noEmit (tourne automatiquement avant build)
npm test             # Vitest, single run
npm run test:watch   # Vitest, watch
npm run build        # Compile vers dist/admin/ + dist/theme-assets/

Tester contre un site Flexweg de staging

Comme tout est statique côté public, créer un site Flexweg de test est trivial : créez un sous-domaine Flexweg (gratuit), uploadez dist/admin/ dessus, configurez un projet Firebase séparé. Vous obtenez un environnement de staging complet en 10 minutes.

Travailler sur un plugin ou un thème externe

Les plugins / thèmes externes vivent dans external/plugins/<id>/ et external/themes/<id>/. Chaque dossier a son propre package.json + vite.config.ts. Pour développer :

BASH
cd external/plugins/<votre-plugin>
npm install --legacy-peer-deps
npm run build    # produit <id>.zip

Puis uploadez le ZIP via Plugins → Install dans l'admin de votre site de staging. Pour un workflow plus rapide pendant le développement, déclarez le plugin dans src/plugins/index.ts pour qu'il soit compilé dans le bundle admin — vous l'externaliserez quand il sera prêt.

Voir aussi