如何更新Angular CLI版本10

发表于 2020年6 月29日星期一上午 6:57:08

要将Angular CLI更新到最新版本（现在是10），您需要更新全局软件包。如果您要开始一个全新的角度项目，则需要更新全面的软件包。但是，如果要升级现有项目，则还必须更新特定于项目的软件包。

您可以通过运行ng update @ angular / cli @ angular / core命令对核心框架和CLI的当前稳定版本执行必要的更新。要升级到下一个Beta或预发行版本，可以在运行命令时使用–next = true选项。

要从一个主要的Angular版本升级到另一版本，请使用ng update @ angular / cli @ ^格式 @角/核心@ ^。

如何将Angular CLI更新到版本10

要更新Angular CLI 10，我们需要遵循以下步骤。

卸载旧版本的Angular CLI
使用npm cache verify命令验证NPM Cache。
安装最新版本的Angular CLI（当前为Angular CLI 10）

如果您是一位有经验的开发人员，那么您几乎每年都会看到，他们至少发布2个版本。因此，您必须使用最新版本。您可以在其官方文档中找到有关Angular CLI的更多信息。

您可以使用以下命令检查当前版本的Angular CLI。

从上图可以看到，我有Angular CLI 9版本。因此，下一步是将Angular CLI 9升级到Angular CLI 10。

要更新最新的angular-cli软件包，您必须执行以下步骤。

首先，我们需要卸载旧版本的Angular CLI。在本例中，请卸载Angular CLI 9。

sudo npm uninstall -g angular-cli // For Mac or Linux 
npm uninstall -g angular-cli // For Windows Open Powershell on Administrator Mode

然后，我们必须使用以下命令清除缓存。

sudo npm cache verify 

or
 
// for windows in admin mode 
npm cache verify

现在，通过以下命令安装Angular CLI 10或最新版本。

sudo npm install -g @angular/cli@latest

 sudo npm install -g @angular/cli@latest
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
/usr/local/bin/ng -> /usr/local/lib/node_modules/@angular/cli/bin/ng

> @angular/cli@10.0.0 postinstall /usr/local/lib/node_modules/@angular/cli
> node ./bin/postinstall/script.js

? Would you like to share anonymous usage data with the Angular Team at Google u
nder
Google’s Privacy Policy at https://policies.google.com/privacy? For more details
 and
how to change this setting, see http://angular.io/analytics. No
+ @angular/cli@10.0.0
updated 1 package in 21.537s

从输出中，您可以看到我们已经成功安装了Angular CLI版本10。

要验证在我们的系统中，键入以下命令。

ng --version

输出量

这就对了。现在，您可以看到我们已将Angular CLI升级到最新版本，即现在的10。

您可以看到RxJS版本也更改为最新的6.5.5。

升级依赖项后，请清除npm缓存以避免错误。

验证npm缓存始终是最佳实践。

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

Angular CLI升级错误和修复

升级Angular CLI时，当您按下以下命令来检查Angular版本时，可能最终会收到类似以下的错误。

ng version --v

您将收到以下错误。

找不到’/ usr / local / lib / node_modules / @ angular / cli / node_modules / uuid’的有效导出主目录

现在，此错误与节点版本有关。

您可以通过将节点保持为以下版本之一来解决此错误。

如果您使用的是Angular，请保留Node版本10、12或14。

不要使用Node的奇数版本。始终保持Node的偶数版本。

要升级node.js，请查看如何更新node.js指南。

现在，要检查node.js版本，请键入以下命令。

node -v

我的Mac上安装了Node.js 14.4版本。

node -v
v14.4.0

升级node.js后，尝试并运行上述Angular CLI升级步骤，一切顺利。

当您升级Angular CLI并遇到任何错误时，最好的解决方案是卸载该Angular CLI并解决该问题，然后再次安装Angular CLI。

这样，将解决大多数与Angular CLI相关的错误。

因此，我们这里将Angular CLI升级到10版本的主要目标已经结束。

如果您已经有一个角度项目，并且想要升级到版本10，请按照以下步骤操作。

如何升级现有的Angular项目

如果您已经创建了一个Angular项目并将该项目更新为angular 10，则转到angular项目目录并键入以下命令。

ng update @angular/core

升级RxJS

您可以使用ng update命令更新RxJS。

ng update rxjs

创建一个新的Angular 10项目

要创建一个新的Angular 10项目，请键入以下命令。

ng new angular10crud 
cd angular10crud 
ng serve

如果您面临任何npm安装：未处理的拒绝错误：EACCES：权限被拒绝错误，那么请尝试以下命令。它将给予许可。

sudo chown -R $USER:$GROUP ~/.npm 
sudo chown -R $USER:$GROUP ~/.config

现在，查看新安装的Angular 10项目。

➜  angular ng new angular10crud
? Would you like to add Angular routing? Yes
? Which stylesheet format would you like to use? Sass   [ https://sass-lang.com/
documentation/syntax#the-indented-syntax ]
CREATE angular10crud/README.md (1031 bytes)
CREATE angular10crud/.editorconfig (274 bytes)
CREATE angular10crud/.gitignore (631 bytes)
CREATE angular10crud/angular.json (3710 bytes)
CREATE angular10crud/package.json (1263 bytes)
CREATE angular10crud/tsconfig.base.json (458 bytes)
CREATE angular10crud/tsconfig.json (475 bytes)
CREATE angular10crud/tslint.json (3184 bytes)
CREATE angular10crud/.browserslistrc (648 bytes)
CREATE angular10crud/karma.conf.js (1025 bytes)
CREATE angular10crud/tsconfig.app.json (292 bytes)
CREATE angular10crud/tsconfig.spec.json (338 bytes)
CREATE angular10crud/src/favicon.ico (948 bytes)
CREATE angular10crud/src/index.html (299 bytes)
CREATE angular10crud/src/main.ts (372 bytes)
CREATE angular10crud/src/polyfills.ts (2835 bytes)
CREATE angular10crud/src/styles.sass (80 bytes)
CREATE angular10crud/src/test.ts (753 bytes)
CREATE angular10crud/src/assets/.gitkeep (0 bytes)
CREATE angular10crud/src/environments/environment.prod.ts (51 bytes)
CREATE angular10crud/src/environments/environment.ts (662 bytes)
CREATE angular10crud/src/app/app-routing.module.ts (246 bytes)
CREATE angular10crud/src/app/app.module.ts (393 bytes)
CREATE angular10crud/src/app/app.component.sass (0 bytes)
CREATE angular10crud/src/app/app.component.html (25757 bytes)
CREATE angular10crud/src/app/app.component.spec.ts (1080 bytes)
CREATE angular10crud/src/app/app.component.ts (218 bytes)
CREATE angular10crud/e2e/protractor.conf.js (869 bytes)
CREATE angular10crud/e2e/tsconfig.json (299 bytes)
CREATE angular10crud/e2e/src/app.e2e-spec.ts (646 bytes)
CREATE angular10crud/e2e/src/app.po.ts (301 bytes)

在创建新的Angular项目时，他们在问两件事。

是否要创建路由。
在angular 10项目中我们需要使用哪种样式。我选择了Sass。

提供适当的选项后，它将创建一个新的角度项目。

最后，我们的Angular CLI 10更新或升级教程已经结束。

资讯来源：由0x资讯编译自APPDIVIDEND，版权归作者Krunal所有，未经许可，不得转载