• About Me
  • Contact Us
  • Privacy Policy
  • Terms and Conditions
  • Advertise / Sponsor

DOTNET DETAIL

Learn Microsoft .NET Technologies

  • Home
  • Tutorials
    • Angular
      • Angular 5
      • Angular 6
    • ASP.NET Core
    • Azure
    • React
    • Vue
  • Books
  • Courses
  • Cloud Hosting
  • Interview Questions
You are here: Home / Angular / How to upgrade Angular 6 App to Angular 7 in Visual Studio Code

How to upgrade Angular 6 App to Angular 7 in Visual Studio Code

December 1, 2018 by mebakar1005 Leave a Comment

In this tutorial, we are going to learn how to upgrade angular 6 app to Angular 7 application. And moreover, in this tutorial, we will also discuss some angular 7 features. So, first-of-all, we will discuss some core features of angular 7 and then finally, we will upgrade angular 6 app to angular 7 application

In previous tutorial, i have discuss how to create a new angular 7 project using visual studio 2017.

How to create an Angular 7 and Asp Net Core app using VS2017

Angular 7 core features

Now, in angular 7, you will see some new features that are listed below.

  • When you will create a new angular application with “ng new yourProject” command, then a prompt will ask you to add features like routing and different type of styles.
  • Now, it supports Typescript 3.1, RxJS 6.3, and Node 10.
  • Angular 7 is more faster than previous version.
  • Angular 7 will remove “reflect-metadata” polyfil from production.
  • Angular 7 uses Budget Bundles. Application will warn you when your bundle will cross the limit 2mb (by default warning at 2mb) and application will error at 5mb(by default error at 5mb). You can easily adjust it according to your needs by just going to angular.json file.
  • The Angular Material CDK : 

ScrollingModule: Angular 7 allows virtual scrolling which loads and unloads elements from DOM on the visibility of the data such as images or large lists.

DragDropModule: Now Angular 7 supports Drag and Drop feature. Now, user can drag and drop items to reorder or transfer items between lists.

How to upgrade angular 6 app to angular 7?

Let’s start to upgrade angular 6 app to angular 7.

This is very easy to upgrade angular 6 app to angular 7. You can do it with just one command. So, first-of-all, open the project which you have built in angular 6. Now, open command terminal and then run this below command in your terminal.

=> ng update @angular/cli @angular/core

After running this above command, you will see all the packages are now updated in your project. You can verify via package.json.

Note: – I am using visual studio code in this project, so i am using vs code terminal. But if you are using Visual Studio 2017 for this tutorial, then open command terminal and then you need to open your project directory where your project’s file “package.json” is located and now run the above command.

Now, build and run your application.

Thank you for reading. Keep visiting and sharing.

How to deploy Angular 6 & Asp Net Core App to Azure using Visual Studio
Virtual Scrolling and Drag and Drop in Angular 7 (Angular Latest Version)

Related

See also  How to add Authentication to Angular 7 and Asp.Net Core 3 using VS2019

Filed Under: Angular, Angular 5, Angular 6, Angular 7 Tagged With: Angular 6, Angular 7, Angular 7 Features, ANGULAR TUTORIAL, Upgrade Angular 6 to Angular 7

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Buy me a coffeeBuy me a coffee

Jobs

Dotnet Jobs

Join Us

Join Us

Subscribe to Blog via Email

Enter your email address to subscribe.

Recent Posts

  • Top LINQ interview questions and answers.
  • Difference between .NET Core and .NET Framework
  • Top 10 Programming Languages of the Future.
  • Top MVC Interview Questions & Answers
  • 20 best Data Science Books: Beginner to Advanced Level
  • 10 Best Machine Learning Laptops
Copyright © 2022