如何正确将角度2（npm）升级到最新版本？-Java 学习之路

122

最近我在https://angular.io/docs/ts/latest/tutorial/开始了Angular 2教程 .

然后我继续使用Angular 2 beta 8.现在我恢复了教程，最新的测试版是beta 14 .

如果我只是做 npm update 一些模块（预装了教程）更新但不是Angular2（我可以看到 npm ls ） .

如果我做 npm update angular 2 或 npm update angular2@2.0.0beta.14 它也没有做任何事情 .

11 回答

2
命令 npm update -D && npm update -S 将 package.json 中的所有包更新为其最新版本 according to their defined version range . 你可以阅读更多关于它here .

如果要从 2.0.0-rc.1 之前的版本更新Angular，则需要手动编辑 package.json ，因为Angular被拆分为几个npm模块 . 如果没有这个，当angular2包指向 2.0.0-beta.21 时，你永远不会使用最新版本的Angular .
您可以在quickstart repository中找到包含一些最常见模块的列表 .

Notes:
- A cool way to stay up to date with your packages' latest version 将使用npm outdated，它会显示所有过时的软件包及其所需的最新版本 .
- 我们需要链接两个命令 npm update -D 和 npm update -S 的原因是为了克服this bug，直到它被修复 .
回复于 2024-04-29T04:50:07+08:00
4

我用于迁移的另一个很好的包从Angular2的beta版到 Angular2 2.0.0 final 是 npm-check-updates

它显示了package.json中指定的所有软件包的最新可用版本 . 与 npm outdated 相比，它还能够编辑你的package.json，使你能够在以后做 npm upgrade .

Install

sudo npm install -g npm-check-updates

Usage

ncu 用于显示

ncu -u 用于重写package.json

回复于 2024-04-29T04:50:07+08:00

Upgrade to latest Angular 5

Angular Dep包： npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router}@latest --save

由cli npm install --save core-js@latest rxjs@latest zone.js@latest 安装的其他软件包

Angular Dev软件包： npm install --save-dev @angular/{compiler-cli,cli,language-service}@latest

类型开发包： npm install --save-dev @types/{jasmine,jasminewd2,node}@latest

由angular cli安装为dev dev的其他软件包： npm install --save-dev codelyzer@latest jasmine-core@latest jasmine-spec-reporter@latest karma@latest karma-chrome-launcher@latest karma-cli@latest karma-coverage-istanbul-reporter@latest karma-jasmine@latest karma-jasmine-html-reporter@latest protractor@latest ts-node@latest tslint@latest

安装Angular cli使用的最新支持版本（不要做@latest）： npm install --save-dev 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": {}
  }
}

回复于 2024-04-29T04:50:07+08:00

53
更新：
从CLI v6开始，您可以运行ng update，以便将您的依赖项自动更新为新版本 .

有时使用ng update，您可能需要添加--force标志 . 如果这样做，请确保您当前的角度版本支持以这种方式安装的打字稿版本，否则您可能需要降级打字稿版本 .

另请查看本指南Updating your Angular projects

仅限bash用户

如果你在 Mac/Linux 或在 Windows 上运行bash（在默认情况下不能工作 Windows CMD ）你可以运行oneliner：

npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router,compiler-cli}@4.4.5 --save

yarn add @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router,compiler-cli}@4.4.5

只需指定你想要的版本，例如@ 4.4.5，或者把@latest放到最新版本检查你的package.json，以确保你正在更新你应用依赖的所有@ angular / *包
- 要在项目运行中查看完整的 @angular 版本：
  npm ls @angular/compiler 或 yarn list @angular/compiler
- 要检查npm run上可用的最新稳定 @angular 版本：
  npm show @angular/compiler version
回复于 2024-04-29T04:50:07+08:00
0
官方的npm页面提供了一种结构化方法来更新全局和本地场景的角度版本 .

1.首先，您需要从系统中卸载当前角度 .
```
npm uninstall -g angular-cli
npm uninstall --save-dev angular-cli
npm uninstall -g @angular/cli
```
2.清理缓存
```
npm cache clean
```
EDIT

正如@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
```
请在下面的链接中查看相同的内容：

https://www.npmjs.com/package/@angular/cli#updating-angular-cli

这将解决问题 .
回复于 2024-04-29T04:50:07+08:00
0
使用npm-upgrade的替代方法：
- npm i -g npm-upgrade
转到项目文件夹
- npm-upgrade check
它会询问您是否要升级包，选择是

这很简单
回复于 2024-04-29T04:50:07+08:00

如果要将所有软件包安装/升级到最新版本并运行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），以及 devDependencies （-D）中的cli包

回复于 2024-04-29T04:50:07+08:00

31

刚开始：

https://update.angular.io

选择您正在使用的版本，它将为您提供分步指南 .

我建议选择“高级”来查看所有步骤 . 复杂性是一个相对的概念 - 我不知道这个功能是谁的愚蠢想法，但如果你选择'基本'，它将不会显示你需要的所有步骤，你可能会错过一些重要的事情，你的否则'基本'应用程序正在使用 .

从版本6开始，有一个新的Angular CLI命令 ng update ，它可以智能地查看您的依赖项并执行检查以确保您正在更新正确的东西:-)

步骤将概述如何使用它:-)

回复于 2024-04-29T04:50:07+08:00
206

npm uninstall --save-dev angular-cli npm install --save-dev @ angular / cli @ latest ng update @ angular / cli ng update @ angular / core --force ng update @ angular / material or npm i @angular / cdk @ 6 @ angular / material @ 6 --save npm install typescript @'> = 2.7.0 <2.8.0'

回复于 2024-04-29T04:50:07+08:00
7

最好的方法是在vscode中使用扩展名（pflannery.vscode-versionlens） .

这将检查所有满足并检查最佳拟合 .

我有很多问题更新和保持我的应用程序功能unitll我让verbose lense做了检查然后我运行

npm i

安装新建议的依赖项 .

回复于 2024-04-29T04:50:07+08:00

如果你看起来像我一样只是将你的项目更新到最新的那些是自Angular 6以来我的工作形式：

打开项目文件夹上的控制台：如果键入：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版本

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

回复于 2024-04-29T04:50:07+08:00

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

11 回答

仅限bash用户

刚开始：

相关问题