Right now, Angular 7 has been officially released. So, in this blog, we are going to learn, how to update Angular 6 or older version to Angular 7
.
In first few steps, we are going to use Windows Powershell
with Administrator.
Check the existing versions of Node.JS, NPM and Angular CLI
Run these commands to check these versions.
Check Node.JS version
node -v
Check NPM version
npm -v
Check Angular CLI version
ng -v
See the below screenshot for above 3 commands.
Here, in the above screenshot, you can see we have Node version v8.11.1, NPM version v6.0.0 and Angular CLI version 6.0.0.
Updating to Angular CLI 7
In the next step, we are going to uninstall existing Angular CLI using this command.
npm uninstall -g angular-cli
After successfully uninstallation, we are going to install latest Angular CLI, which is Angular 7
.
Run this command to install Angular CLI 7.
npm install -g @angular/cli@latest
This will successfully install the Angular CLI 7. See the below screenshot for above commands.
Check the latest Angular 7 version
Now, you can check the latest version of Angular CLI 7 by running this command.
ng --version
See the below screenshot.
Creating Angular 7 based application
Now, after successfully updating Angular v6 to v7, we are now going to create a new Angular 7 app named testproj
.
ng new testproj
This command will ask 2 questions, shown in below screenshot.
Updating the Packages
Run these commands to update these packages.
ng update @angular/core
ng update rxjs
Above 2 packages will be updated. See the below screenshot.
Now, run this command to open the application in browser window.
ng serve --open
This will open the app in your browser window.
Updated Package.json file
If you open your application, and check the package.json
file, you will see most of the dependencies are in version 7.0.0.
Router Modules injected by default
In the initial steps, Angular CLI asked for installing the routes, so you can app.routing.module.ts
file in the project folder.
Summary
So, in this blog, we learned how to update Angular v6 to v7, and create the application in same updated version.
I hope you will enjoy reading this blog.
Cheers!
Reference
Further Reading
Creating your first app in Angular 7