如何将Angular CLI升级到最新版本

Question

我使用 ng --version 命令得到了：

@angular/cli: 1.0.0

这不是最新版本。

因为我在系统上全局安装了 Angular CLI，所以我尝试升级它：

npm update angular-cli -g

但它不起作用，因为它仍然是 1.0.0 版本。

- Francesco Borzi

Answer 1

在GitHub存储库中阅读了一些问题报告后，我找到了解决方案。

为了更新全局安装在您系统中的angular-cli软件包，您需要运行：

npm uninstall -g @angular/cli
npm install -g @angular/cli@latest

根据您的系统，您可能需要在上述命令前加上sudo前缀。

此外，您很可能还想更新本地项目版本，因为在项目目录内，它将具有比全局版本更高的优先级：

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

感谢 grizzm0 在 GitHub 上指出这个问题。

更新CLI后，您可能还需要更新Angular版本。

注意：如果您正在从旧版本升级到Angular CLI 6+，则可能需要阅读此内容。

编辑：此外，如果您仍在使用1.x版本的cli，则需要将angular-cli.json转换为angular.json，可以使用以下命令执行（有关更多详细信息，请参见此处）：

ng update @angular/cli --from=1.7.4 --migrate-only

- Francesco Borzi

---

严谨提示：您可以在 GitHub 的“Releases”选项卡中找到有关版本更改的更多详细信息。链接：https://github.com/angular/angular-cli/releases - Stuti Verma

2017年更新（npm@5）：如果您确实需要清除缓存，请使用命令"npm cache clean --force"。请注意，此操作将强制清除缓存，因此请谨慎使用。 - Neyt

为什么要卸载 angular-cli 而不是整个 @angular/cli？ - YASH DAVE

运行命令npm cache clean会抛出错误：“从npm @ 5开始，npm缓存可以自我修复损坏问题，并且从缓存中提取的数据保证是有效的。如果您想确保一切一致，请改用'npm cache verify'。”“如果您想强制执行，则可以添加--force选项”。 - crazyCoder

奇怪的是，我从A6更新到A7时，在全局安装@latest版本时，最终得到的仍然是相同的版本（6.2.4）。在Mac上，使用NPM 8.9.4。我执行了npm uninstall -g @angular/cli将其从全局中删除。但是重新安装后，我得到了相同的6.0版本。 - Mattijs

Answer 2

首次使用者：

npm install -g @angular/cli

更新/升级：

npm install -g @angular/cli@latest

检查：

ng --version

或者 Angular 14.X +

ng version

请查看文档。

- Kofi Sammie

---

如果你在更新后没有看到新版本，请尝试关闭并重新打开终端，然后再次运行 ng --version。 - Omar

谢谢。在2021年，是否仍需要使用@latest来升级？如果我已经全局安装了旧版本的Angular CLI并且没有包括@latest标签，会发生什么？ - Kyle Vassella

是的，请执行此操作，而且在2021年或2022年，您可以运行“npx @angular/cli@13 update @angular/core@13 @angular/cli@13”，这应该将您带到Angular的13版本，因为Angular现在使用TypeScript 4.4并且是13版。 https://update.angular.io/?l=3&v=12.0-13.0 - Kofi Sammie

Answer 3

ng6+升级到7.0

更新RxJS（基于RxJS 6.3）

npm install -g rxjs-tslint
rxjs-5-to-6-migrate -p src/tsconfig.app.json

移除 rxjs-compat

然后更新核心包和 Cli：

ng update @angular/cli @angular/core

（可选）将 Node.js 更新到支持 NG7 的版本 10。

ng6+（Cli 6.0+）：简化了命令。

首先，更新您的 Cli。

npm install -g @angular/cli
npm install @angular/cli
ng update @angular/cli

然后，更新您的核心软件包

ng update @angular/core

如果你使用RxJS，请运行。

ng update rxjs

它将会把RxJS升级到6版本，并在底层安装rxjs-compat包。

如果你遇到构建错误，请尝试手动安装以下内容：

npm i rxjs-compat
npm i @angular-devkit/build-angular

最后，检查您的版本

ng v

关于生产构建的说明：

ng6不再在polyfills.ts中使用intl

//remove them to avoid errors
import 'intl';
import 'intl/locale-data/jsonp/en';

ng5+（Cli 1.5+）

npm install @angular/{animations,common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router}@next typescript@2.4.2 rxjs@'^5.5.2'
npm install typescript@2.4.2 --save-exact

注意：

1. 截至撰写本文，Cli 1.6支持的TypeScript版本最高为2.5.3。
2. 使用@next会更新包到beta版本（如果有），使用@latest获取最新的非beta版本。

在更新全局和本地包之后，请清除缓存以避免错误发生：

npm cache verify (recommended)
npm cache clean (for older npm versions)

以下是官方参考资料:

1. 更新Cli
2. 更新核心软件包：核心软件包

- Pageii Studio

---

"npm cache clean --force" 真的帮了我很多。 - Pini Cheyni

为什么这部分不在发布说明中呢！ - Drenai

请问您能否确认一下您所说的 RxJS 6 已被弃用的情况。无论我在哪里查看，似乎v6都是最新的稳定版本 https://github.com/ReactiveX/rxjs https://rxjs-dev.firebaseapp.com/ - Joey Gough

@JoeyGough 很好的发现！Ng7 依赖于 rxjs 6.3。感谢您的评论。参考：https://github.com/angular/angular/blob/master/CHANGELOG.md#user-content-700-2018-10-18 - Pageii Studio

Answer 4

这个强大的命令会安装并替换最后一个软件包。

我有类似的问题。我已经解决了。

 npm install -g @angular/cli@latest

并且

npm install --save-dev @angular/cli@latest

- BehrouzMoslem

---

这将适用于本地的Angular CLI，请检查我的答案以升级全局的CLI。 - Francesco Borzi

升级了我的全局 CLI。 - Rahmathullah M

Answer 5

以下方法对我起作用：

npm uninstall -g @angular/cli

然后

npm cache verify

然后

npm install -g @angular/cli

我使用Windows 10，有时候需要使用：npm cache clean --force。如果你在安装过程中没有遇到任何问题，就不需要这样做。

- Enayat

---

默认情况下，“@latest”不需要指定。 - Ambroise Rabier

如果这个解决方案对您不起作用：https://dev59.com/JVkS5IYBdhLWcg3wp4bO#58678941 - veben

Answer 6

这个命令运行正常：

npm upgrade -g @angular/cli

- wdavilaneto

---

这似乎将CLI升级到最新的次要版本。 - Alexei - check Codidact

Answer 7

Note 2023年2月22日：最近发布了一个很棒的工具，叫做NGVM。
它可能非常有用，可以帮助你维护Angular CLI版本。

如果您在管理全局CLI版本方面遇到任何困难，最好使用工具来处理。以下是一些选项：

NVM适用于MAC / Windows或者使用Volta

---

要更新Angular项目中的本地CLI，请按照以下步骤进行：

从CLI v6开始，您只需要运行ng update，就可以自动将依赖关系更新到新版本。

ng update @angular/cli

使用ng update时，有时您可能想要添加--force标志。

您还可以传递--all标志以同时升级所有软件包。

ng update --all --force

如果你只想迁移CLI，只需运行以下命令：

ng update @angular/cli --migrateOnly

您还可以通过传递标志--from=from来指定迁移的版本，例如--from=1.7.4。此标志仅适用于更新单个包，并且仅适用于迁移。

更新后，请确保您安装的typescript版本支持当前的angular版本，否则您可能需要降级typescript版本。还要记住，通常最新版本的angular不支持最新版本的typescript。

检查Angular CLI / Angular / NodeJS / Typescript兼容性版本在这里

另请参阅更新Angular项目和update.angular.io指南。

---

旧答案：
您只需要使用angular-cli-diff进行差异比较并将更改应用于您的当前项目即可。

以下是步骤：

1. 假设您从1.4升级到1.5，然后执行https://github.com/cexbrayat/angular-cli-diff/compare/1.4.0...1.5.0
2. 单击“文件已更改”选项卡。
3. 将更改应用于您的当前项目。
4. npm install / yarn
5. 测试所有npm scripts (有关详细信息，请参见：https://dev59.com/06Pia4cB1Zd3GeqP5urk#45431592)

- angularrocks.com

Answer 8

除了@ShinDarth的答案之外。

我照他说的做了，但我的包没有更新 Angular 版本，我知道这篇文章是关于 angular-cli 的，但我认为这也可能有帮助。

• 所以在执行了 @ShinDarth 上面说的步骤后，为了修复我的 Angular 版本，我不得不用 -ng new projectname 创建一个新项目，生成一个包。
• 复制新包，然后将新包粘贴到所有需要更新的项目包中（记得添加你的依赖项并更改第一行的名称），或者你可以手动更改版本而不需要复制和粘贴。
• 然后运行 -npm install。

现在我的 ng serve 又可以使用了，也许有更好的方法来完成所有这些操作，如果有人知道，请分享，因为这对需要更新的所有项目都很痛苦。

- Leonardo Souza Paiva

---

看起来更像是对我的答案的补充，而不是一个完整的答案，所以也许你可以将它作为评论放在我的答案下面？ - Francesco Borzi

抱歉，你说得对，但是我需要50点声望才能在你的答案下发表评论。 - Leonardo Souza Paiva

Answer 9

针对我的情况，我使用了npm install --save-dev angular-cli来本地安装angular-cli。
所以，当我使用命令npm install -g @angular/cli时，它会生成错误信息，指出：

您的全局Angular CLI版本（1.7.3）高于您的本地版本（1.4.9）

请注意，angular-cli、@angular/cli和@angular/cli@latest是两个不同的cli。
解决方法是卸载所有的cli，然后使用以下命令安装最新的angular cli：

npm install -g @angular/cli@latest

- ARKhan

Answer 10

要将Angular CLI更新到新版本，您必须同时更新全局包和项目的本地包。 全局包：

npm uninstall -g @angular/cli
npm cache verify
# if npm version is > 5 then use `npm cache verify` to avoid errors (or to avoid using --force)
npm install -g @angular/cli@latest

本地项目包：

rm -rf node_modules dist # use rmdir /S/Q node_modules dist in Windows Command Prompt; use rm -r -fo node_modules,dist in Windows PowerShell
npm install --save-dev @angular/cli@latest
npm install

来源：Github

- Hasan Fathi