How To Upgrade Your Angular 4 App Into Angular 5
Posted By : Rohit Goyal | 26-Feb-2018
Description:-
Angular 5.0 is finally released. It brings a lot of improvement over angular 4.On top of Angular 5, Angular CLI v1.5 is also released.
In this blog I will show you that, how can you migrate your angular 4 application into angular 5. If you are currently working on your angular 4 application. I will advise you
to first take backup of your existing branch and try to upgrade packages that I will suggest further.After successful migration of angular 4 application into angular 5, you can
do upgrading in your project.
Upgrade your Angular CLI to version 1.5 :-
First of all, we need to update Angular CLI version to v1.5 to take advantages of Angular 5 build optimizer. I have assumed that you have installed Angular CLI globally.
Steps of upgrading Angular CLI version are as follows.
1) npm uninstall -g angular-cli
2) npm cache clean
3) npm install -g @angular/cli@latest
After that to check Angular CLI version. you can run the command ng-v to check your current Angular CLI version.
After upgrading your Angular CLI version you have to update dependencies.
You have to update the entry in your package.json file. After that, your application is ready to migrate in angular 5.
"dependencies": {
"@angular/animations": "^5.0.0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/platform-browser": "^5.0.0",
"@angular/platform-browser-dynamic": "^5.0.0",
"@angular/router": "^5.0.0",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
}
After updating package.json with these dependencies you just need to run npm install.It takes some time. After that your angular 4 application will migrate in to angular 5.
If after running your angular 5 app you found some issue in plugins. You can try to figure out alternatives of these plugins. After finding an alternative to the broken plugin you can use that alternative
in your application.
That's it. Now your application is ready to run in angular 5 and your angular 5 build becomes more optimized.
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Rohit Goyal
Rohit is an experienced Frontend Developer, having good experience in HTML5, CSS3, Bootstrap, Jquery, AngularJS, Angular4/5, Restful API Integration, ES6 . His hobbies are playing cards and cricket.