Ionic community recently released its latest version Ionic 5 in the market. Today, in this article we will understand how can we upgrade an existing Ionic 4 application to Ionic 5.
We will run this migration in 5 easy steps.
First of all, install Ionic 5 CLI globally. Run below command.
npm install -g ionic@latest
Once you update the CLI to the latest version, you can verify it by running the below command.
As Ionic recommends that before you jump to directly upgrade your app to Ionic 5, you should first bring your app to the latest Ionic 4 release (4.11.10). And then you should run the application to see any deprecation warnings in the developer console. You should fix those warnings and then move forward to update the app to Ionic 5.
Run the below command to update the Ionic 4 app to version 4.11.10.
npm install @firstname.lastname@example.org --save
Run the below command to verify that the app has been upgraded to 4.11.10 version.
Before you move forward, please run and test the application by running it via
ionic serve and ensure that the app has been successfully upgraded to
4.11.10 version and there is no deprecation warning in the developer console.
@ionic/angular-toolkit packages to the latest releases by running below command.
npm install @ionic/angular@latest @ionic/angular-toolkit@latest --save
Again verify the versions by running the below command.
So far, we have updated
@ionic/angular-toolkit packages only, but still, we have not updated the angular and its dependencies that are used by the Ionic app.
As Ionic 5 supports Angular 9, so we should update the angular libraries used in the Ionic App to the latest version of Angular (That is Angular 9 as of now).
For this, I would recommend going through Angular's website, where they clearly explain how to migrate from one version to another. Here is the link to their website - https://update.angular.io.
ionic infocommand to check the current Angular version of the Ionic app.
Run the below command to launch the upgraded Ionic 5 app in the browsers.
Go through all the screens and test the upgraded application.
This is how we can migrate an Ionic 4 application to the latest Ionic 5 application in 5 easy steps. Please let me know your feedback, and suggestions in below comment box.
Reference - https://ionicframework.com/docs/building/migration