Angular10 の新機能についての簡単な説明

この記事では、Angular10 の新機能について説明します。一定の参考値があるので、困っている友達が参考になれば幸いです。

Angular 10 は、人気のある Web 開発フレームワークのメジャー アップグレードであり、通常は 6 月 24 日に正式リリースとして利用可能になります。正式バージョンのアップグレードは、Google が開発した TypeScript ベースのフレームワークに基づいており、新バージョンよりも品質、ツール、エコシステムの改善機能に重点を置いています。

Angular 10 は、以前の Angular バージョンよりも小さいです。新機能には、Angular マテリアル UI コンポーネント ライブラリの新しい日付範囲ピッカーと CommonJS インポート警告が含まれます。 CommonJS インポート警告は、CommonJS にパッケージ化された依存関係を使用すると、アプリケーションが大きくなり速度が遅くなる可能性があるため、開発者が ECMAScript モジュール パッケージを置き換えることができるように警告します。

関連チュートリアルの推奨事項: 「angular チュートリアル」

さらに、オプションの厳密な設定により、新しいワークスペースを作成するときにより厳密なプロジェクト設定が提供されますng new、ng new -- strict を介して。このフラグを有効にすると、新しい設定で新しいプロジェクトが初期化され、保守性が向上し、エラーの検出に役立ち、CLI がアプリケーションで高度な最適化を実行できるようになります。

Angular 10 のダウンロード先

---

Angular 10 の一般リリースは GitHub で見つけることができます。現在の Angular インストールを更新するには、次のコマンドを実行できます:

ng update @angular/cli @angular/core

Angular 10 の新機能

---

Angular 10 の主な機能含む：＃ ＃＃＃＃＃

• TSlib (ヘルパー関数を含む TypeScript ランタイム ライブラリ) が TSlib 2.0 に更新されました。 TypeScript 用の TSLint 静的解析ツールが TSLint 6 に更新されました。
• 実際の ngtsc コンパイラをラップするコンパイラ インターフェイスを追加しました。言語サービス固有のコンパイラは、プロジェクト インターフェイスを使用して複数の型チェック ファイルを管理し、必要に応じて Scriptinfo を作成します。
• 新しいプロジェクトのブラウザ構成が更新され、古い、あまり使用されていないブラウザが除外されました。 Internet Explorer 9、Internet Explorer 10、および Internet Explorer Mobile はサポートされていません。
• Angular パッケージ形式には ESM5 または FESM5 パッケージが含まれなくなり、yarn または npm install を実行する際のダウンロードとインストールが Angular パッケージとライブラリの時間に節約されます。
• コンパイラでは、プロパティの読み取りとメソッドの呼び出しのために名前スコープが追加されました。
• EntryPointFinder。これは、tsjconfig.json ファイルで指定されたプログラムのインポートからシードできるプログラム ベースのエントリ ポイント ファインダーです。アクティブなプログラムがインストールされているエントリ ポイントの小さなサブセットのみをインポートする場合、これは DirectoryWalkerEntryPointFinder よりも高速であることが予想されます。
• オートコンプリート機能は、価値とパフォーマンスの問題に疑問があるため、&amp などの HTML エンティティから削除されました。
• クロージャの公開から devmode ファイルへの明示的なマッピング。この機能は、運用ビルド入力を同等の開発モードに変換する必要がある開発ツールを対象としています。
• 重大な変更の 1 つは、ModuleWithProviders を必須にすることです。 ModuleWithProviders パターンが Ivy のコンパイルおよびレンダリング パイプラインで動作するには、ジェネリック型パラメーターが必要ですが、この送信前は、View Engine でジェネリック型を省略できました。開発者がジェネリック型なしで ModuleWithProviders を使用している場合、バージョン 10 の移行ではコードが更新されます。ただし、開発者が View Engine を使用し、ジェネリック型を無視するライブラリに依存している場合は、ビルド エラーが発行されます。この場合、ngcc は役に立ちません。移行はアプリケーション コードのみを対象とします。ライブラリを修正するには、ライブラリの作成者に連絡する必要があります。回避策として、tsconfig で SkipLibChecks を false に設定するか、Ivy のみを使用するようにアプリケーションを更新します。 現在、TypeScript 3.9 が搭載されており、TypeScript 3.8 のサポートは削除されました。これは大きな変化です。 TypeScript 3.6 および TypeScript 3.7 もサポートされなくなりました。
• コンパイラ cli の型チェックのパフォーマンスが向上しました。
• パフォーマンスを向上させるために、
basePaths
• の計算は延期され、TargetedEntryPointFinder が必要な場合にのみ作業が行われるようになりました。以前は、ファインダーがインスタンス化されるたびに basePaths が計算されていましたが、ターゲットのエントリ ポイントがすでに処理されている場合は労力が無駄でした。 複数の翻訳ファイルの結合をサポートします。以前は、ロケールごとに 1 つの翻訳ファイルのみが許可されていました。ユーザーはロケールごとに複数のファイルを指定できるようになり、各ファイルのトランザクションはメッセージング ID によってマージされます。
• 非同期ロックのタイムアウトを設定できます。これにより、
retryAttempts
• および retryDelay オプションを設定するための ngcc.config.js ファイルのサポートが追加されます。統合テストには新しいタイムアウト チェックが追加され、ngcc.config.js を使用してタイムアウトが短縮され、テストに時間がかかりすぎるのを防ぎます。 互換性を破る変更として、不明な要素に関する警告がエラーとして記録されるようになりました。これによってアプリケーションが中断されることはありませんが、console.error を介して何も記録されることを期待しない一部のツールがトリガーされる可能性があります。
• もう 1 つの重大な変更では、
EMPTY
• を返すパーサーはナビゲーションをキャンセルします。ナビゲーションを続行するには、開発者はパーサーを更新して、default!Empty などの特定の値を更新する必要があります。 メタデータに依存関係情報と ng-content セレクターを追加しました。提案されたコンパイラ機能は、ライブラリで定義されたディレクティブ/コンポーネントの提案を提供する機能とともに、Angular Language Service などのツールに役立つ追加のメタデータを提供します。
• パフォーマンスの向上は、エントリ ポイントのマニフェスト サイズの縮小とマニフェスト内のキャッシュ技術によって実現されます。また、依存関係のキャッシュはエントリ ポイント マニフェストで行われ、毎回計算するのではなく、そこから読み取られます。以前は、エントリ ポイントを処理する必要がない場合でも、ngcc (Angular Ivy Compatibility Compiler) がエントリ ポイントのファイルを解析して依存関係を計算していましたが、large_node モジュールの場合はこれに多くの時間がかかりました。
• ngcc のパフォーマンスを向上させるために、古いロック ファイルの即時レポートが許可されるようになりました。さらに、解析された tsconfig ファイルのキャッシュされたコピーが保存され、tsconfig パスが同じであれば再利用できます。
• 1 つの重大な変更では、昼間を深夜にフォーマットすることを含むロジックが更新されました。
b
• または B 形式コードを使用して時刻を形式設定する場合、表示される文字列は数日間にわたる日照時間を正しく処理できません。代わりに、ロジックはデフォルトのケースである AM に戻ります。このロジックは午前 0 時以降の時刻に一致するように更新され、正しい出力 (例: 英語の at nightat night) が表示されるようになりました。formatDate() または DatePipe または b および B 形式コードを使用するアプリケーションは、この変更の影響を受けます。
• ルーターの場合、CanLoad プロテクターは Urltree を返すことができるようになりました。 Return CanLoadProtectionUrltree of Urltree 現在のナビゲーションとリダイレクトをキャンセルします。これは、同じく追加された CanActivate ガードで利用可能な現在の動作と一致します。これはプリロードには影響しません。 CanLoad ガードはあらゆるプリロードをブロックします。CanLoad ガードを持つルートはプリロードされず、ガードはプリロードの一部として実行されません。
• ParsedProperty の ExpressionBinding を使用したマイクログラマー式の ExpressionBinding 内の正しい値の範囲の伝播。これにより、範囲がテンプレート AST (VE および Ivy) に伝播されます。このアドバイスはコンパイラにも当てはまります。
• コアの修正では、Angular 機能を使用する装飾されていないクラスの派生クラスを装飾するロジックが装飾されていないクラスの移行に追加されます。
• 重大な変更では、Urlmatcher の型は常に null を返すことができることを反映します。
• Service Worker については、タスクが長時間実行またはタイムアウトしたときに Service Worker が登録されない状況が修正されました。
• Kong 配列内の未定義の式を回避するコンパイラや、存在しないシンボルをインポートする際の移行エラーを回避するカーネルなど、多くのバグ修正が行われました。 Terser インライン化バグの中核部分にも回避策があります。別のバグ修正により、TestBed での置換の影響を受けるモジュールが正しく識別されます。
• Angular NPM には、Closure Compiler の高度な最適化をサポートする特定の jsdoc コメントが含まれなくなりました。これは大きな変化です。パッケージ内の Closure Compiler のサポートは実験的であり、しばらくの間廃止されました。 Closure Compiler を使用している人は、NPM で公開されているバージョンを使用するよりも、ソースから直接ビルドされた Angular パッケージを使用する方が良いでしょう。一時的な回避策として、ユーザーは、閉鎖フラグ --compilation_level=SIMPLE を使用して現在のビルド パイプラインを閉じることを検討できます。このフラグにより​​、ビルド パイプラインはビルド可能で実行可能なアーティファクトを確実に生成しますが、高度な最適化が無効になっているため、ペイロード サイズは増加します。

翻訳元: https://www.infoworld.com/article/3537449/whats-new-in-angular-10.html

以上がAngular10 の新機能についての簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。