web-dev-qa-db-fra.com

migration de Angular 6 vers Angular 7

J'ai récemment mis à niveau mon application Angular 4 vers Angular 6 et je souhaite maintenant passer à Angular 7. Selon la ci-dessous l'article, l'exécution de la commande la commande suivante ne devrait pas prendre plus de 10 minutes pour mettre à niveau.

ng update @ angular/cli @ angular/core

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

Je ne vois rien se produire sur l'invite de commande après avoir exécuté cette commande. Aucune erreur. Quelqu'un pourrait-il me dire pourquoi cela se produit

angularangular7
3
Tom

J'ai mis à jour 6 à 7 en utilisant:

Dépendances angulaires

   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

Dépendances de développement angulaires

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

Dépendances; Core-js et Zone.js

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

Dépendances Dev; Types, codelyzer, outils de karma, jasmin, rapporteur et 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

La nouvelle version 3+ de TypeScript

npm install TypeScript@latest --save-dev

Dernière version 6+ de RxJS

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

Et:

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

Dernière version 4+ de Webpack

npm install webpack@latest --save-dev

source

5
mrapi

ici, vous pouvez trouver un guide relatif à la mise à jour de n'importe quelle version vers angular 7

https://update.angular.io/

Ou vous pouvez simplement exécuter une commande dans votre CLI

  ng update --all
2
Pooja Patel

PROCÉDURE DE MIGRATION ANGULAIRE 6.1 à 7

Afin de mettre à niveau correctement de Angular 6.1 à angular 7, vous devez suivre les étapes suivantes:

ATTENTION: Veuillez vérifier si tous vos modules importés sont compatibles avec angular 7, mettez-les à niveau si nécessaire.

Avant la mise à niveau vers Angular 7:

  1. Modifiez l'importation HttpModule en HttpClientModule (importez {HttpClientModule} de '@ angular/common/http';)

  2. Modifiez les importations Http (si vous en avez) en import {HttpClient} de '@ angular/common/http';

N'oubliez pas de supprimer tous les JSON.parse (réponse), puisque vous n'avez plus besoin de le faire avec HttpClient

  1. Si vous utilisez RXjs, vous devez supprimer les anciennes dépendances de RXjs 6. Pas de soucis, vous pouvez le faire en exécutant les scripts suivants:

    npm install -g rxjs-tslint

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

Vous devrez peut-être mettre à jour TypeScript pour migrer correctement rxjs: npm i -g TypeScript

  1. Désinstaller le module rxjs-compat (npm désinstaller rxjs-compat)

  2. Si vous utilisez le Angular Service worker, migrez tous les fichiers versioned vers le tableau de fichiers.

  3. Mettre à jour angular cli vers v7:

    ng update @ angular/cli

  4. Mettre à jour angular Core vers v7:

    ng update @ angular/core

  5. Enfin, vous devez mettre à niveau Angular material:

    ng update @ angular/material

1
Jorge Valvert

Si vous me ressemblez pour mettre à jour votre projet au plus tard, voici ce qui fonctionne depuis moi Angular 6:

Ouvrez la console sur votre dossier de projet: If you type: ng update alors vous obtiendrez le message ci-dessous:

        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.

Donc, je vais généralement droit et fais:

ng update --all

Enfin, vous pouvez vérifier votre nouvelle 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
0
Ernest

Vous pouvez utiliser ceci:

https://update.angular.io

Sélectionnez la version que vous utilisez et elle vous donnera un guide étape par étape.

Print from update.angular.io

0
Caio Ladislau

ng-update ne fonctionnait pas non plus pour moi - je l'ai résolu en mettant à jour tous les paquets en utilisant npm-check , et en triant manuellement les quelques erreurs que j'ai eues après.

0
Lars Rødal