web-dev-qa-db-ja.com

Angular 6からAngular 7

私は最近、Angular 4アプリをAngular 6にアップグレードし、Angular 7.にアップグレードしたいと考えています。記事の下で、コマンドを実行すると、次のコマンドでアップグレードに10分以上かかることはありません。

ng update @ angular/cli @ angular/core

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

このコマンドを実行した後、コマンドプロンプトで何も発生しません。エラーはありません。なぜこれが起こっているのか誰かに教えてもらえますか

angularangular7
3
Tom

私は6を7に更新しました：

角度依存

   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開発依存関係

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

依存関係; Core-jsとZone.js

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

開発依存関係;タイプ、コードライザ、カルマツール、ジャスミン、分度器、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

TypeScriptの新しいバージョン3+

npm install TypeScript@latest --save-dev

RxJSの最新バージョン6+

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

そして：

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

Webpackの最新バージョン4+

npm install webpack@latest --save-dev

ソース

5
mrapi

ここでは、任意のバージョンからangular 7への更新に関連するガイドを見つけることができます

https://update.angular.io/

または、CLIでコマンドを実行することもできます

  ng update --all
2
Pooja Patel

ANGULAR 6.1から7への移行手順

Angular 6.1からangular 7に適切にアップグレードするには、次の手順に従う必要があります。

警告：インポートしたすべてのモジュールがangular 7と互換性があるかどうかを確認してください。7、必要に応じてアップグレードしてください。

Angular 7にアップグレードする前：

  1. HttpModuleインポートをHttpClientModuleに変更します（ '@ angular/common/http'から{HttpClientModule}をインポートします）。

  2. Httpインポート（ある場合）をimport {HttpClient}を '@ angular/common/http';に変更します。

すべてのJSON.parse（response）を削除することを忘れないでください。HttpClientでこれを実行する必要がなくなるためです。

  1. RXjsを使用している場合は、RXjs 6の古い依存関係を削除する必要があります。心配する必要はありません。次のスクリプトを実行すれば実行できます。

    npm install -g rxjs-tslint

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

Rxjsを正常に移行するには、TypeScriptを更新する必要がある場合があります。npm i -g TypeScript

  1. Rxjs-compatモジュールのアンインストール（npm uninstall rxjs-compat）

  2. Angular Service Workerを使用する場合、versionedFilesをfiles配列に移行します。

  3. 更新angular cli to v7：

    ng update @ angular/cli

  4. angular Core to v7：

    ng update @ angular/core

  5. 最後に、アップグレードする必要がありますAngular material：

    ng update @ angular/material

1
Jorge Valvert

Angular 6：

プロジェクトフォルダーでコンソールを開きます：If you type: ng updateすると、次のメッセージが表示されます。

        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.

だから私は通常まっすぐ行って行います：

ng update --all

最後に、新しいバージョンを確認できます。

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

これを使用できます：

https://update.angular.io

使用しているバージョンを選択すると、ステップバイステップガイドが表示されます。

Print from update.angular.io

0
Caio Ladislau

ng-updateも私にとっては機能しませんでした- npm-check を使用してすべてのパッケージを更新し、手動で発生したいくつかのエラーを整理することで解決しました。

0
Lars Rødal