6

I have recently upgraded my Angular 4 app to Angular 6 and now want to upgrade to Angular 7. According to the below article , running command the following command shouldn't take more than 10 mins to upgrade.

ng update @angular/cli @angular/core

https://blog.angular.io/version-7-of-angular-cli-prompts-virtual-scroll-drag-and-drop-and-more-c594e22e7b8c

I dont see anything happening on the command prompt after running this command. No errors. Could somebody tell me why this is happening

2

6 Answers 6

6

I've updated 6 to 7 using:

Angular dependencies

   npm install @angular/animations@latest @angular/common@latest @angular/compiler@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest --save

Angular dev dependencies

  npm install @angular-devkit/build-angular@latest @angular/compiler-cli@latest @angular/cli@latest @angular/language-service@latest --save-dev

Dependencies; Core-js and Zone.js

npm install core-js@latest zone.js@latest --save

Dev dependencies; Types, codelyzer, karma tools, jasmine, protractor and tslint

npm install @types/jasmine@latest @types/node@latest codelyzer@latest karma@latest karma-chrome-launcher@latest karma-cli@latest karma-jasmine@latest karma-jasmine-html-reporter@latest jasmine-core@latest jasmine-spec-reporter@latest protractor@latest tslint@latest --save-dev

The new version 3+ of TypeScript

npm install typescript@latest --save-dev

Latest version 6+ of RxJS

npm install rxjs@latest rxjs-compat@latest --save

And:

npm install rxjs-tslint@latest --save-dev

Latest version 4+ of Webpack

npm install webpack@latest --save-dev

source

3

ANGULAR 6.1 to 7 MIGRATION PROCEDURE

In order to upgrade properly from Angular 6.1 to angular 7, you have to follow the next steps:

WARNING: Please check if all your imported modules are compatible with angular 7, upgrade them if necessary.

Before upgrade to Angular 7:

  1. Change the HttpModule import to HttpClientModule (import {HttpClientModule} from '@angular/common/http';)

  2. Change the Http imports (if you have any) to import {HttpClient} from '@angular/common/http';

Don´t forget to remove all JSON.parse(response), since you don´t need to do that anymore with HttpClient

  1. If you are using RXjs, you have to remove RXjs 6 old dependencies. No worries, you can do that running the following scripts:

    npm install -g rxjs-tslint

    rxjs-5-to-6-migrate -p src/tsconfig.app.json

You may have to update typescript in order to migrate rxjs successfully: npm i -g typescript

  1. Uninstall rxjs-compat module (npm uninstall rxjs-compat)
  2. If you use the Angular Service worker, migrate any versionedFiles to the files array.

  3. Update angular cli to v7:

    ng update @angular/cli

  4. Update angular Core to v7:

    ng update @angular/core

  5. Finally you have to upgrade Angular material:

    ng update @angular/material

2

You can use this:

https://update.angular.io

Select the version you're using and it will give you a step by step guide.

Print from update.angular.io

2

here,you can find guide related to update from any version to angular 7

https://update.angular.io/

Or you can simply run a command into your CLI

  ng update --all
0

ng-update was not working for me either - I solved it by updating all packages using npm-check, and sorting out the few errors I had after manually.

1
  • You can also try to delete package-lock.json and then ng update should work.
    – matzar
    Jun 13, 2022 at 9:13
0

If you are looking like me for just updating your project to the latest these is what works form me since Angular 6:

Open the console on your project folder: If you type: ng update then you will get the below message:

        We analyzed your package.json, there are some packages to update:

          Name                               Version                  Command to update
         --------------------------------------------------------------------------------
          @angular/cli                       7.0.7 -> 7.2.2           ng update @angular/cli
          @angular/core                      7.0.4 -> 7.2.1           ng update @angular/core

There might be additional packages that are outdated.
    Run "ng update --all" to try to update all at the same time.

So I usually go straight and do:

ng update --all

Finally you can check your new version:

ng version
Angular CLI: 7.2.2
Node: 8.12.0
OS: win32 x64
Angular: 7.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.12.2
@angular-devkit/build-angular     0.12.2
@angular-devkit/build-optimizer   0.12.2
@angular-devkit/build-webpack     0.12.2
@angular-devkit/core              7.2.2
@angular-devkit/schematics        7.2.2
@angular/cli                      7.2.2
@ngtools/webpack                  7.2.2
@schematics/angular               7.2.2
@schematics/update                0.12.2
rxjs                              6.3.3
typescript                        3.2.4
webpack                           4.28.4

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.