关于 Angular v12 的主要更改和更新步骤

20190605172344.jpg

自 Angular v12 发布以来已经过去了大约三周时间。本文将回顾 Angular v12 的主要变更,并实际更新现有项目以确认变更点。

Angular v12 的主要更改包括以下内容:

我认为最好参考Angular日本用户组的信息,以了解Angular v12的主要变化。

    • 機能アップデートはコミュニティからのプルリクエストがメイン

 

    • 「Ivy Everywhere」(Angular エコシステム全体での Ivy 使用)のため、View Engineを非推奨化

 

    • コンポーネントのインラインスタイルで Sass などが使えるようになった

ng new した際の –strict オプションがデフォルトで有効に

ng build した際、デフォルトでプロダクションモードでビルドされるようになった
Protractor をデフォルトの e2e ツールとせず、Cypress、WebdriverIO、TestCafe等を利用できるように変更
デフォルトのリンターから TSLint を外し、デフォルトのリンターは持たない形に
IE11サポートを非推奨に

我挑选了一些我关注的内容,但功能上没有太大的变化。需要注意的是一些默认行为的改变(例如在使用ng new命令时,默认启用–strict选项)。

与Angular的最新版本完美匹配的UI库是“Angular Ignite UI”。

因为我们希望提供给开发者最出色的 Angular 开发体验,因此 InfraStics 公司开发的 Angular 兼容的 UI 组件库 Ignite UI for Angular 总是在 Angular 新版本发布后的数日内推出兼容的版本。这次也不例外,在仅仅两天内,我们就发布了 Ignite UI for Angular 12.0.0。

请查看以下文章了解 Ignite UI for Angular 12.0.0 的新功能:

Angular项目的更新

本次,我们将以下示例应用程序升级到最新版本。这是一个使用 Ignite UI for Angular 的网格组件和图表组件制作的示例,之前的版本使用了 Angular v11。
链接:https://igjp-sample.github.io/igniteui-angular-application-template/grid

我们将在查看以下更新指南的内容时继续进行。
https://update.angular.io/?locale=ja-JP&l=3&v=11.0-12.0

首先,执行ng update @angular/core@12 @angular/cli@12。

接下来,执行命令 ng update @angular/cli@12 –migrate-only production-by-default,将构建时的默认模式设置为生产模式。

最後,使用 `ng update igniteui-angular` 命令来更新 Ignite UI for Angular。

建站并检查后,发现与Ignite UI for Angular有一些需要调整的部分。
根据更新指南(目前只提供英文文献),进行了以下调整。

    これまで igx-core に暗黙的に含まれていた igx-typography mixin を明示的に @include するように変更
@include igx-core();
@include igx-typography(
  $font-family: $material-typeface,
  $type-scale: $material-type-scale
);
@include igx-theme($default-palette);
    入力フォームの DatePicker はこれまで igxDatePickerTemplate ディレクティブでカスタムなテンプレートを作成し表現していましたが、igx-date-picker のプロパティで表現できるようになりました。

可以在以下链接中查看更新前后的差异:
https://github.com/igjp-sample/igniteui-angular-application-template/compare/e36bff4..53e2047

尽管有一些需要手动调整的地方,但例如对于 onItemClicked 事件名称的更改等,Ignite UI for Angular 能够自动适应,因此我们能够顺利完成更新。此外,与 Angular v12 的更新相关,完全不需要调整工作。

Image from Gyazo

如果您在Angular的更新方面有任何疑问或困扰,请随时向我们咨询。

如果您有关于Angular项目的更新的疑问,无论是针对跨越较大版本更新还是规模较大的应用程序更新等情况,本次更新不是特别庞大的应用程序,版本升级也只是从11升级到12,无需跨版本更新,因此可以轻松完成更新。请随时通过以下的免费咨询请求进行咨询:
https://jp.infragistics.com/free-consultation

广告
将在 10 秒后关闭
bannerAds