Que fait angular-migration ?
Migrez d'AngularJS vers Angular en mode hybride, avec réécriture progressive des composants et mise à jour de l'injection de dépendances. À utiliser lors de la mise à niveau d'applications AngularJS, de la planification de migrations de framework ou de la modernisation de code Angular hérité.
Aperçu
Ce skill guide les développeurs tout au long du processus de migration d'AngularJS (1.x) vers Angular (2+). Il préconise une approche incrémentale, en mode hybride, où les deux frameworks coexistent, permettant une transition en douceur sans interrompre le développement.
Pourquoi ce skill est utile
- Migration à faible risque : Évitez les réécritures big bang en déplaçant progressivement les composants.
- Productivité maintenue : Continuez à développer de nouvelles fonctionnalités pendant la migration.
- Pratiques standard : Suivez les directives officielles d'Angular pour la migration hybride.
- Testabilité : Chaque étape peut être testée individuellement.
Plateformes supportées
- AngularJS 1.5+ avec Angular 2+
- outils :
@angular/upgrade,angular-cli,TypeScript
Comment ça fonctionne
- Préparation de l'application AngularJS : Mettez à niveau vers AngularJS 1.5+ et structurez le code en utilisant des composants.
- Configuration du mode hybride : Ajoutez Angular à l'application en utilisant
UpgradeModulepour que les deux frameworks s'exécutent côte à côte. - Réécriture incrémentale des composants : Remplacez les composants AngularJS par des composants Angular un par un, en utilisant
downgradeComponentetupgradeComponentpour assurer l'interopérabilité. - Mise à jour de l'injection de dépendances : Migrez les services AngularJS vers des services Angular injectables, en utilisant
downgradeInjectablepour les rendre accessibles depuis AngularJS. - Finalisation : Une fois tous les composants migrés, retirez AngularJS et le wrapper hybride.
Commandes et exemples
# Installer les dépendances nécessaires
npm install @angular/upgrade --save
# Générer un nouveau composant Angular
ng generate component my-new-component
# Exemple de downgrade d'un service AngularJS
angular.module('myApp').factory('myService', downgradeInjectable(MyService));
Bonnes pratiques
- Commencez par les composants les moins dépendants.
- Utilisez TypeScript pour une meilleure maintenabilité.
- Testez chaque étape avec des tests unitaires et d'intégration.
- Documentez chaque changement pour faciliter la revue de code.
Ressources
Faites évoluer votre code AngularJS vers Angular en toute confiance.