如何从 Angular 4 更新/升级到 Angular 5+

Question

我需要将我的项目从 Angular 4 更新到 Angular 5+ ,

我需要将以下所有依赖项更改为 Angular 5+。

我还将 Angular CLI 更新到 1.5.0。

我试图创建新项目，但它似乎只创建了 Angular 4 个项目。

ng new NG5_Project

"dependencies": {
  "@angular/animations": "^4.2.4",
  "@angular/common": "^4.2.4",
  "@angular/compiler": "^4.2.4",
  "@angular/core": "^4.2.4",
  "@angular/forms": "^4.2.4",
  "@angular/http": "^4.2.4",
  "@angular/platform-browser": "^4.2.4",
  "@angular/platform-browser-dynamic": "^4.2.4",
  "@angular/router": "^4.2.4",
  "core-js": "^2.4.1",
  "rxjs": "^5.4.2",
  "zone.js": "^0.8.14"
}

我哪里做错了。

CLI 配置：

Answer 1

查看 Angular 博客

https://blog.angular.io/version-5-0-0-of-angular-now-available-37e414935ced

文章中提到了更新指南。

您可以在这里找到它：https://angular-update-guide.firebaseapp.com/

此外，您可以将 angular-CLI 更新为 1.5.0，这将创建 angular v5 项目。大家可以对比下和自己的不一样。

Answer 2

此特定问题已通过 Node 版本更新得到解决。

我必须更新 Node 版本，

sudo apt-get install nodejs

npm uninstall -g @angular/cli

npm cache clean

npm install -g @angular/cli@latest

ng new ProjectName

node --version ==> 8.9.0

ng --version ==> 1.5.0

"dependencies": {
    "@angular/animations": "^5.0.0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",
    "rxjs": "^5.5.2",
    "zone.js": "^0.8.14"
}

更新 :

现在还有官方 Angular 更新指南：https://update.angular.io

您可以通过适当的步骤将 Angular 版本从最低 v2.0 更新到最新版本（当前为 v15.0）

Answer 3

将您的 Angular 4 升级到 Angular 5

打开你的webpack.config.js

在ContextReplacementPlugin

中添加以下代码

 /angular(\|\/)core(\|\/)(@angular|esm5)/

Answer 4

如果您只想将 angular4 项目升级到 angular5，请执行以下操作。

转到您的项目目录。
打开命令提示符并运行执行以下命令
npm 安装-g npm-check-updates
ncu -u

这对我有用。

http://www.talkingdotnet.com/upgrade-angular-4-app-angular-5-visual-studio-2017/

Answer 5

这是正确答案，而且超级简单。

遵循官方 Angular 升级指南。

您将填写一个简短的表格，选择您使用的 Angular 版本以及要升级到的版本。然后，它会向您显示执行升级所需采取的必要步骤列表。您应该按照本指南进行所有升级。（请在离开前点赞）:)

https://update.angular.io/

Answer 6

详细说明，这对我有帮助既是全局升级也是 PROJECT LOCAL 升级。

确切的指南（当然）在 https://update.angular.io/ 中。

全球：

$ npm uninstall -g angular-cli (to be sure)
$ npm uninstall -g @angular/cli
$ npm cache clean
$ npm install -g @angular-cli@1
$ ng -v ... this will show you the current CLI version.

本地项目：

$ cd to/your/project/folder
$ remove the folder node_modules
$ npm install --save-dev @angular/cli@1
$ npm install

然后：

npm install @angular/animations@^5.0.0 @angular/common@^5.0.0 @angular/compiler@^5.0.0 @angular/compiler-cli@^5.0.0 @angular/core@^5.0.0 @angular/forms@^5.0.0 @angular/http@^5.0.0 @angular/platform-browser@^5.0.0 @angular/platform-browser-dynamic@^5.0.0 @angular/platform-server@^5.0.0 @angular/router@^5.0.0 typescript@2.4.2 rxjs@^5.5.2

这可能是需要的（并且不会造成伤害）：$npm audit fix

$ npm install typescript@2.4.2 --save-exact

来源：

https://update.angular.io/ 会告诉你最好的路线。

主要区别在于您仍然使用 'http' 模块。您可以（或需要）从 http 迁移到 httpclient 模块。在大多数情况下，这很容易。

如何从 Angular 4 更新/升级到 Angular 5+

How to update / upgrade from Angular 4 to Angular 5+

updates

angular

angular5