Photo by Michael Dziedzic on Unsplash

Simple guide to upgrading Ionic 4 to 5

Don’t let the major version scare you from upgrading

I’m not sure about you, but I cringe whenever I see a major release of a package comes out. The anxiety of dependency hell and so forth…(I’m talking to you Angular 2).

But this was by far the easiest upgrade ever for my web app 6MWD.app

1. Follow the migration guide

npm install @ionic/angular@latest @ionic/angular-toolkit@latest --save

2. Serve the project

ionic serve

3. Check your ionic icon names, for me, it was the chevrons

4. Try and build production…this is the real test

ionic build --prod

5. Will probably fail

6. Updated dependencies like this

"@angular/common": "8.2.13",
"@angular/core": "8.2.13",
"@angular/forms": "8.2.13",
"@angular/platform-browser": "8.2.13",
"@angular/platform-browser-dynamic": "8.2.13",
"@angular/pwa": "^0.803.23",
"@angular/router": "8.2.13",
"@angular/service-worker": "^8.2.14",

7. Update dev dependencies like this

"@angular-devkit/architect": "^0.803.23",
"@angular-devkit/build-angular": "^0.803.23",
"@angular-devkit/core": "^8.3.23",
"@angular-devkit/schematics": "^8.3.23",
"@angular/cli": "^8.3.23",
"@angular/compiler": "8.2.13",
"@angular/compiler-cli": "8.2.13",
"@angular/language-service": "^8.2.14",
"@ionic/angular-toolkit": "^2.1.2",

Clap or don’t…this was fun to write. Hope this was helpful.