Migration de projet et upgrade framework
Vue 2→3, Express→Fastify, Webpack→Vite — OpenClaw migre smooth, tu évites les pièges
Une migration, c'est toujours l'enfer
Vue 2 doit passer en Vue 3. Tu ouvres le guide de migration, 200+ pages. Options API → Composition API, Vuex → Pinia, Vue Router syntax aussi. C'est parti.
Après la modif, boom: les libs tierces sont pas compatibles. Tu change la lib, les styles explosent. Tu fixes les styles, tu lances les tests, 50% en rouge. Et ça c'est juste le frontend, le Python 2→3 backend attend encore...
Le pire? Le boss qui demande "c'est fini cette semaine?"
Balance ton vieux projet à OpenClaw, ça fait:
1. Scan tous les fichiers, liste ce qui faut changer
2. Priorise: breaking changes en premier, puis API dépréciées
3. Génère le code modifié par fichier, avec explication de chaque changement
4. Flag les dépendances tierces incompatibles, propose des alternatives
T'as pas besoin de lire le guide page par page. OpenClaw l'a déjà lu et sait exactement ce qui change dans ton projet.
3 prompts migration qui couvrent les cas classiques
Frontend, backend, build tools: un prompt pour chaque.
Migre ce projet Vue 2 vers Vue 3, critères:
1. Convertis tous les components Options API en Composition API (syntaxe script setup)
2. Migre l'état Vuex vers Pinia
3. Upgrade Vue Router 3 → Vue Router 4 (attention aux gardiens de route)
4. Gère les APIs supprimées: $listeners, $attrs, filters
5. Vérifie la compatibilité Element UI → Element Plus (ou autre lib)
Sortie par fichier, explique chaque changement.
Liste à la fin les problèmes de compatibilité à vérifier manuellement.
Migre cette app Express.js vers Fastify:
1. Routes: Express router → enregistrement Fastify
2. Middlewares:
- body-parser → built-in Fastify
- cors → @fastify/cors
- helmet → @fastify/helmet
- custom middleware → Fastify hooks (onRequest / preHandler)
3. Erreurs: error middleware Express → setErrorHandler Fastify
4. Objs req/res: gère les différences req.body / res.json
5. Validation: joi / express-validator → JSON Schema built-in Fastify
Garde tous les endpoints identiques, zero impact front.
Migre mon projet Webpack en Vite:
1. Crée vite.config.ts qui correspond à webpack.config.js
2. Gère ces différences courantes:
- require() → import
- process.env → import.meta.env
- Modules CSS / SCSS config
- Alias config
- Proxy config
3. Identifie les loaders Webpack incompatibles, propose les plugins Vite
4. Met à jour package.json scripts
5. Gère la compatibilité CommonJS
Fournis les fichiers config migrés et la liste des sources à changer.
Setup avant la migration
Avant de demander à OpenClaw de migrer, bien d'organiser les infos du projet.
# Info de migration du projet
## Stack technologique actuelle
- Framework: Vue 2.7 + Vuex 3 + Vue Router 3
- Build tool: Webpack 4
- UI lib: Element UI 2.x
- Node: 16.x
## Stack technologique cible
- Framework: Vue 3.4 + Pinia + Vue Router 4
- Build tool: Vite 5
- UI lib: Element Plus 2.x
- Node: 20.x
## Taille du projet
- Components: ~80
- Pages: ~30
- Custom directives: 5
- Custom filters: 8
## Problèmes connus
- Une lib de components n'a pas de version Vue 3
- Du code utilise this.$refs pour la manip DOM
Migration OpenClaw vs migration manuelle
- Scanne auto tout ce qui faut changer, rien oublié
- Génère le code modifié par fichier, copy-paste c'est bon
- Explique chaque changement, c'est comme avoir la doc de migration
- Alerte sur les libs tierces incompatibles et propose des alternatives
- Gros projet: quelques jours. Petit projet: quelques heures.
- Faut lire la doc officielle complète (souvent des centaines de pages)
- Cherche et change chaque fichier à la main, super facile de rater quelque chose
- Quand t'as un souci, c'est Google et Stack Overflow
- Les problèmes de libs tierces tu les découvres qu'en lançant
- Gros projet = plusieurs semaines, surprises à chaque fois