La version 5.0 d’Ionic (Magnesium) est disponible depuis le 11 février. Cette nouvelle version majeure du framework arrive avec son lot d’évolutions.
Qu’est-ce qui a réellement changé par rapport la version précédente ? Les bonnes pratiques de la version 4 sont-elles toujours d’actualités avec cette nouvelle version ? Quel effort doit-on fournir afin de migrer une application de la version 4 à la version 5 ?
Alors, qu’est-ce qui va vraiment changer dans Ionic 5 ?
Pas mal de nouvelles fonctionnalitĂ©s et Ă©volutions, mais pas de bouleversements majeurs.Â
C’est en effet ce qu’il ressort de l’annonce d’Ionic sur leur blog et de la consultation de la liste des changements – changelog – disponible sur github.
De plus, il y aura une rĂ©trocompatibilitĂ© des API de la version 4 avec la version 5. C’est une excellente nouvelle car cela facilitera d’autant la migration d’une application de la version 4 Ă la version 5.Â
En qualité de partenaire officiel d’Ionic, Jnesis a décidé d’analyser les principales évolutions. Parmi les principaux changements de la version 5 d’Ionic, on peut donc noter:
- La suppression des Events au profit des observables / observers de rxjs.
- De nouvelles couleurs par défaut sont disponibles pour Ionic 5
- L’attribut « mode » d’un élément s’applique désormais à lui-même ainsi qu’à l’ensemble des ses enfants
- Il n’y a plus d’icône spécifique à Android ou iOS. De nouvelles options sont cependant disponibles pour personnaliser l’apparence des icônes
- Les styles ont été revus :
- remplacement d’attributs par des classes
- changement dans les médias queries
- la classe activated à été remplacée par ion-activated
- certaines propriétés CSS globales ont été mises à jour
- Certains composants ont été modifiés (Action Sheet, Anchor, Back Button Card Split Pane, Button FAB Button Item Menu Button Tabs, Controllers, Header / Footer, List Header, Menu, Nav Link, Radio, Searchbar, Segment, Segment Button, Select Option, Skeleton Text)
Comment migrer une application en version 4 vers 5 ?
Contrairement à la migration de la version 3 vers la version 4 qui comprenait des changements très importants au niveau de la structure du framework, la migration de la version 4 à la version 5 est beaucoup moins lourde.
Avant de mettre à jour son application vers la version 5, il est recommandé de mettre à jour l’application vers la dernière version 4, puis de corriger l’ensemble des warnings js présents dans l’application (les warnings en version 4 non corrigés générerons des erreurs en version 5).
Une fois les warnings corrigés, on lance la commande suivante :
npm i @ionic/angular@latest --save L’essentiel des adaptations est alors visuel (mise à jour des couleurs, propriétés CSS customisées, icônes ou styles dans les composants).
N’hésitez pas à  nous contacter si vous souhaitez vous faire accompagner par des experts ionic dans votre démarche de migration ou pour réaliser un audit préliminaire..
