如何正确地将angular 2（npm）升级到最新版本？

最近我开始了Angular 2教程

最后是角度2β8。 现在我恢复了教程，最新的测试版是beta 14

如果我简单地执行npm更新，那么会更新一些模块（与教程一起预装），但不会更新Angular2（我可以通过npm ls看到这一点）

---

如果我执行npm更新角度2或npm更新angular2@2.0.0beta.14它也不起任何作用。

命令

npm update-D和&npm update-S

将根据将

package.json

中的所有包更新为其最新版本。你可以阅读更多关于它的内容

如果要从

2.0.0-rc.1

之前的版本更新Angular，则需要手动编辑

package.json

，因为Angular被拆分为多个npm模块。没有这一点，由于软件包指向

2.0.0-beta.21

，您将永远无法使用Angular的最新版本。
可以在中找到一个列表，其中列出了入门所需的一些最常见的模块

注意事项：

• 更新软件包最新版本的一个很酷的方法是使用它，它会显示所有过时的软件包及其所需的最新版本

• 我们需要链接两个命令，

  npm update-D

  和

  npm update-S

  的原因是要克服，直到它被修复为止

---

我用来将Angular2的beta版迁移到

Angular2.0.0最终版的另一个不错的包是
npm检查更新

它显示package.json中指定的所有包的最新可用版本。与
npm过时
相反，它还能够编辑package.json，使您能够在以后进行
npm升级

安装

sudo npm安装-g npm检查更新

用法

ncu
用于显示

ncu-u
用于重新编写包。json
更新：

从开始，您可以运行，以便将依赖项自动更新为新版本

有时，您可能需要添加
--force
标志。
如果这样做，请确保得到的typescript版本
您当前的angular版本支持以这种方式安装，
否则，您可能需要降级typescript版本

也请查看本指南


仅供用户使用
如果您在Mac/Linux上运行，或者在Windows上运行bash（默认情况下无法运行），您可以运行oneliner：

npm install@angular/{动画、通用、编译器、核心、表单、http、平台浏览器、平台浏览器动态、路由器、编译器cli}@4.4.5--保存

纱线添加@angular/{动画、通用、编译器、核心、表单、http、平台浏览器、平台浏览器动态、路由器、编译器cli}@4.4.5

只需指定您不想要的版本，例如@4.4.5或放置@latest即可获得最新版本

检查您的
package.json
，以便
确保您正在更新应用程序所依赖的所有
@angular/*
软件包


要在项目运行中查看确切的
@angular
版本：

npm ls@angular/compiler
或
纱线列表@angular/compiler
要检查npm上可用的最新稳定
@angular
版本，请运行：

npm show@angular/编译器版本
如果要将所有软件包安装/升级到最新版本，并且运行的是windows，则可以在
powershell.exe
中使用：

foreach($package in @("animations","common","compiler","core","forms","http","platform-browser","platform-browser-dynamic","router")) {
    npm install @angular/$package@latest -E
}

如果还使用
cli
，则可以执行以下操作：

foreach($package in @('animations','common','compiler','core','forms','http','platform-browser','platform-browser-dynamic','router', 'cli','compiler-cli')){
    iex "npm install @angular/$package@latest -E $(If($('cli','compiler-cli').Contains($package)){'-D'})";
}

这将准确地保存软件包（-E），并且
devdependences
（-D）
官方npm页面中的cli软件包建议使用结构化方法更新全局和本地场景的角度版本

1.首先，您需要从您的
系统

npm uninstall -g angular-cli
npm uninstall --save-dev angular-cli
npm uninstall -g @angular/cli

2.清理缓存

npm cache clean

编辑

正如@candidj所指出的那样

npm cache clean
从npm 5开始重命名为
npm cache verify

3.整体安装

npm install -g @angular/cli@latest

4.本地项目设置（如果有）

rm -rf node_modules
npm install --save-dev @angular/cli@latest
npm install

请在下面的链接上查看相同内容：


这将解决问题。
使用以下替代方法：

npm i-g npm升级
转到您的项目文件夹

npm升级检查
它会询问您是否要升级软件包，请选择“是”

这很简单升级到最新的Angular 5

角度Dep包：
npm install@angular/{动画、通用、编译器、核心、表单、http、平台浏览器、平台浏览器动态、路由器}@latest--save

由angular cli安装的其他软件包
npm安装--保存核心-js@latest rxjs@latest区js@latest

角度开发包：
npm安装--save dev@angular/{compiler cli，cli，language service}@latest

开发包类型：
npm安装--保存dev@types/{jasmine，jasminewd2，node}@latest

angular cli作为dev安装的其他软件包：
npm安装--保存开发codelyzer@latest茉莉花-core@latest茉莉花-reporter@latest karma@latest卡玛铬-launcher@latest业力-cli@latest因果报应报道伊斯坦布尔-reporter@latest业力-jasmine@latest卡玛茉莉花-reporter@latest protractor@latestts-node@latest tslint@latest

安装Angular cli使用的受支持的最新版本（请勿执行@latest）：
npm安装--保存开发typescript@2.4.2

将文件angular-cli.json重命名为.angular-cli.json并更新内容：

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "project3-example"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app",
      "styles": [
        "styles.css"
      ],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "lint": [
    {
      "project": "src/tsconfig.app.json",
      "exclude": "**/node_modules/**"
    },
    {
      "project": "src/tsconfig.spec.json",
      "exclude": "**/node_modules/**"
    },
    {
      "project": "e2e/tsconfig.e2e.json",
      "exclude": "**/node_modules/**"
    }
  ],
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "css",
    "component": {}
  }
}

最好的方法是在vscode中使用扩展名（pflannery.vscode versionlens）。
        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 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