如何通过 ng update 将 Angular 7 更新为 Angular 8
How to update Angular 7 to Angular 8 by ng update
我尝试在终端中通过 运行 ng update @angular/cli @angular/core
将 Angular 项目从核心框架和 CLI 的版本 7.2.5 更新到 8。
来自终端的响应是 'We analyzed your package.json and everything seems to be in order. Good work!'
我的版本列表:
$ ng version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 7.3.9
Node: 11.14.0
OS: darwin x64
Angular: 7.2.15
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router
Package Version
------------------------------------------------------------
@angular-devkit/architect 0.13.9
@angular-devkit/build-angular 0.13.9
@angular-devkit/build-ng-packagr 0.13.9
@angular-devkit/build-optimizer 0.13.9
@angular-devkit/build-webpack 0.13.9
@angular-devkit/core 7.3.9
@angular-devkit/schematics 7.3.9
@angular/cdk 7.3.7
@angular/cli 7.3.9
@angular/material 7.3.7
@ngtools/json-schema 1.1.0
@ngtools/webpack 7.3.9
@schematics/angular 7.3.9 (cli-only)
@schematics/update 0.13.9
ng-packagr 5.2.0
rxjs 6.5.2
typescript 3.2.4
webpack 4.29.0
截至今天,Angular 8 不是稳定版本。
但如果你真的想更新非稳定版本,请在包名称末尾使用 @next。
ng 更新@angular/cli@next @angular/core@next
到今天已经稳定了8.0.0
:)
您可能想尝试 运行 ng update --all
更新 package.json
文件中的所有包。
但是,如果它发现某些 inter-dependencies 与其他软件包不匹配,则可能不会继续。
在这种情况下,您可能还想添加 --force
选项。
或者,您可以选择更量身定制的方法和 hand-pick 软件包进行更新(如 Veeraragavan 在回答中所建议的那样),但您不再需要添加 @next
版本,因为所有 Angular 包 8.0.0 版本目前是稳定的。
除了有关 ng update
命令的其他答案外,请注意 Angular 版本 7 和 8 之间存在重大更改,需要引起注意。
特别是:
- If you use the legacy
HttpModule
and the Http
service, switch to
HttpClientModule
and the HttpClient
service. HttpClient
simplifies the
default ergonomics (you don't need to map to JSON anymore) and now
supports typed return values and interceptors. Read more on
angular.io.
- Make sure you are using Node 10 or later.
Angular 在他们的 Angular Update Guide.
中详细描述了这个过程
如果你重复
ng update @angular/cli @angular/core
它将升级到下一步,即 8
通过 运行
将核心框架和 CLI 更新到版本 8
ng update @angular/cli@8 @angular/core@8
在您的终端
Angular 团队使升级比以前容易得多。通过使用 Angular 更新指南,您可以获得 运行 将项目从 Angular 版本更新到另一个版本所需的命令。
前往该交互式指南并将 7.1.4 指定为当前版本,将目标版本指定为 v8.3.2,然后单击 告诉我如何更新按钮。
指定版本后,您会收到一条警告,提示我们不建议跨多个主要版本。由于我们正在从 v7 迁移到 v8:
Angular 8 使用 TypeScript 3.4,read more about errors that might arise from improved type checking.
确保您使用的是 Node 10 or later。
在你的命令行界面运行下面的命令:
$ ng update
这将分析您项目的 package.json
文件,并为您提供要使用所需命令更新的包列表:
We analyzed your package.json, there are some packages to update:
Name Version Command to update
--------------------------------------------------------------------------------
@angular/cli 7.1.4 -> 8.3.19 ng update @angular/cli
@angular/core 7.1.4 -> 8.2.14 ng update @angular/core
rxjs 6.3.3 -> 6.5.3 ng update rxjs
There might be additional packages that are outdated.
Run "ng update --all" to try to update all at the same time.
所以,让我们首先使用以下命令将核心框架和 CLI 分别更新为 v8.2.14 和 v8.3.19 :
$ ng update @angular/cli @angular/core
这会将核心框架和 CLI 更新为 Angular 8:
Updating package.json with dependency @angular/compiler @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/language-service @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/forms @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/platform-browser @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/platform-browser-dynamic @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/cli @ "8.3.19" (was "7.1.4")...
Updating package.json with dependency @angular/animations @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/common @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency zone.js @ "0.9.1" (was "0.8.26")...
Updating package.json with dependency rxjs @ "6.5.3" (was "6.3.3")...
Updating package.json with dependency @angular/router @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/core @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/compiler-cli @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency typescript @ "3.5.3" (was "3.1.6")...
Note: On Windows I had to run npm install
after ng update @angular/cli @angular/core
to install the new versions of the dependencies.
现在,让我们使用以下命令检查 Angular 的新版本:
$ ng --version
这是命令的输出:
Angular CLI: 8.3.19
Node: 10.16.3
OS: win32 ia32
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.11.4
@angular-devkit/build-angular 0.11.4
@angular-devkit/build-optimizer 0.11.4
@angular-devkit/build-webpack 0.11.4
@angular-devkit/core 7.1.4
@angular-devkit/schematics 8.3.19
@angular/cli 8.3.19
@ngtools/webpack 7.1.4
@schematics/angular 8.3.19
@schematics/update 0.803.19
rxjs 6.5.3
typescript 3.5.3
webpack 4.23.1
您可以看到我们已经成功将Angular CLI更新为v8.3.19,Angular更新为v8.2.14 和不同的核心包。甚至 TypeScript 也升级到 v3.5.3.
我从这个 update guide and this official post
得到了这些说明
我尝试在终端中通过 运行 ng update @angular/cli @angular/core
将 Angular 项目从核心框架和 CLI 的版本 7.2.5 更新到 8。
来自终端的响应是 'We analyzed your package.json and everything seems to be in order. Good work!'
我的版本列表:
$ ng version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 7.3.9
Node: 11.14.0
OS: darwin x64
Angular: 7.2.15
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router
Package Version
------------------------------------------------------------
@angular-devkit/architect 0.13.9
@angular-devkit/build-angular 0.13.9
@angular-devkit/build-ng-packagr 0.13.9
@angular-devkit/build-optimizer 0.13.9
@angular-devkit/build-webpack 0.13.9
@angular-devkit/core 7.3.9
@angular-devkit/schematics 7.3.9
@angular/cdk 7.3.7
@angular/cli 7.3.9
@angular/material 7.3.7
@ngtools/json-schema 1.1.0
@ngtools/webpack 7.3.9
@schematics/angular 7.3.9 (cli-only)
@schematics/update 0.13.9
ng-packagr 5.2.0
rxjs 6.5.2
typescript 3.2.4
webpack 4.29.0
截至今天,Angular 8 不是稳定版本。
但如果你真的想更新非稳定版本,请在包名称末尾使用 @next。
ng 更新@angular/cli@next @angular/core@next
到今天已经稳定了8.0.0
:)
您可能想尝试 运行 ng update --all
更新 package.json
文件中的所有包。
但是,如果它发现某些 inter-dependencies 与其他软件包不匹配,则可能不会继续。
在这种情况下,您可能还想添加 --force
选项。
或者,您可以选择更量身定制的方法和 hand-pick 软件包进行更新(如 Veeraragavan 在回答中所建议的那样),但您不再需要添加 @next
版本,因为所有 Angular 包 8.0.0 版本目前是稳定的。
除了有关 ng update
命令的其他答案外,请注意 Angular 版本 7 和 8 之间存在重大更改,需要引起注意。
特别是:
- If you use the legacy
HttpModule
and theHttp
service, switch toHttpClientModule
and theHttpClient
service.HttpClient
simplifies the default ergonomics (you don't need to map to JSON anymore) and now supports typed return values and interceptors. Read more on angular.io.- Make sure you are using Node 10 or later.
Angular 在他们的 Angular Update Guide.
中详细描述了这个过程如果你重复
ng update @angular/cli @angular/core
它将升级到下一步,即 8
通过 运行
将核心框架和 CLI 更新到版本 8ng update @angular/cli@8 @angular/core@8
在您的终端
Angular 团队使升级比以前容易得多。通过使用 Angular 更新指南,您可以获得 运行 将项目从 Angular 版本更新到另一个版本所需的命令。
前往该交互式指南并将 7.1.4 指定为当前版本,将目标版本指定为 v8.3.2,然后单击 告诉我如何更新按钮。
指定版本后,您会收到一条警告,提示我们不建议跨多个主要版本。由于我们正在从 v7 迁移到 v8:
Angular 8 使用 TypeScript 3.4,read more about errors that might arise from improved type checking.
确保您使用的是 Node 10 or later。
在你的命令行界面运行下面的命令:
$ ng update
这将分析您项目的 package.json
文件,并为您提供要使用所需命令更新的包列表:
We analyzed your package.json, there are some packages to update:
Name Version Command to update
--------------------------------------------------------------------------------
@angular/cli 7.1.4 -> 8.3.19 ng update @angular/cli
@angular/core 7.1.4 -> 8.2.14 ng update @angular/core
rxjs 6.3.3 -> 6.5.3 ng update rxjs
There might be additional packages that are outdated.
Run "ng update --all" to try to update all at the same time.
所以,让我们首先使用以下命令将核心框架和 CLI 分别更新为 v8.2.14 和 v8.3.19 :
$ ng update @angular/cli @angular/core
这会将核心框架和 CLI 更新为 Angular 8:
Updating package.json with dependency @angular/compiler @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/language-service @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/forms @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/platform-browser @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/platform-browser-dynamic @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/cli @ "8.3.19" (was "7.1.4")...
Updating package.json with dependency @angular/animations @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/common @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency zone.js @ "0.9.1" (was "0.8.26")...
Updating package.json with dependency rxjs @ "6.5.3" (was "6.3.3")...
Updating package.json with dependency @angular/router @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/core @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency @angular/compiler-cli @ "8.2.14" (was "7.1.4")...
Updating package.json with dependency typescript @ "3.5.3" (was "3.1.6")...
Note: On Windows I had to run
npm install
afterng update @angular/cli @angular/core
to install the new versions of the dependencies.
现在,让我们使用以下命令检查 Angular 的新版本:
$ ng --version
这是命令的输出:
Angular CLI: 8.3.19
Node: 10.16.3
OS: win32 ia32
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.11.4
@angular-devkit/build-angular 0.11.4
@angular-devkit/build-optimizer 0.11.4
@angular-devkit/build-webpack 0.11.4
@angular-devkit/core 7.1.4
@angular-devkit/schematics 8.3.19
@angular/cli 8.3.19
@ngtools/webpack 7.1.4
@schematics/angular 8.3.19
@schematics/update 0.803.19
rxjs 6.5.3
typescript 3.5.3
webpack 4.23.1
您可以看到我们已经成功将Angular CLI更新为v8.3.19,Angular更新为v8.2.14 和不同的核心包。甚至 TypeScript 也升级到 v3.5.3.
我从这个 update guide and this official post
得到了这些说明