#17 Monthly Angular 5月号 (2020-05-27)

[lacolaco]

ng-japan OnAir vol.17 "Monthly Angular 2020-05" - YouTube

ng-japan OnAirって何？:thinking_face:

Angular日本ユーザー会が主催するYouTube Liveです！
過去のOnAirの配信アーカイブはこちらから視聴できます！

• 最新情報やプラクティスをキャッチアップする機会は多い方がいい
• 勉強会やミートアップは東京に集中してるし、予定が合わないと参加できない…
• オンライン開催なら誰でもどこでも参加できるしアーカイブが残る！ :party_popper:

内容

• 1ヶ月間のAngular周辺事情を振り返る Monthly Angular 2020-05

会場

https://www.youtube.com/channel/UCayXpiOPFQh9MWePLoEFLmg/live

🔔 YouTubeチャンネルを購読 しておくと、配信開始のお知らせを受け取ることができます！

💃 出演者紹介

lacolaco

Google Developers Expert / Angular日本ユーザー会 代表
https://twitter.com/laco2net

okunokentaro

Angular日本ユーザー会、ng-kyoto オーガナイザ
https://twitter.com/okunokentaro

しみきょん

エンジニア at DMM.com / Angular日本ユーザー会のスタッフしてます
https://twitter.com/shimikyonkyon

[lacolaco]

Monthly Angular 2020-05

v9.1.9

https://github.com/angular/angular/blob/master/CHANGELOG.md#919-2020-05-20

• core
  • Angular Elementsのバグ修正

v10.0.0-rc

https://github.com/angular/angular/blob/master/CHANGELOG.md#1000-rc0-2020-05-21

core

• Feature
  • ! TypeScript 3.9アップデート
    • 3.8以下は非互換
  • ! ClosureCompiler向けのjsdoc出力の停止
  • platform-server上でのHTTPリクエストの絶対URL化
    • feat(platform-server): use absolute URLs from Location for HTTP angular/angular#37071
  • language-serverのIvy対応 (strictTemplates)
    • feat(language-service): [ivy] Parse Angular compiler options angular/angular#36922
  • CanLoad が UrlTreeを返せるようになった
    • feat(router): allow CanLoad guard to return UrlTree angular/angular#36610
    • CanActivateと同じになった
  • tslib が direct dependencyに
    • refactor: update to tslib 2.0 and move to direct dependencies angular/angular#37198
    • 9.0でpeerに変わったが、10.0でもとに戻すことに
• Bugfix
  • ! ModuleWithProviders<T>のジェネリック必須化
    • ng updateで自動変更
  • ! input[type=number]が2度valueChangesイベントを発火するバグを修正
    • fix(forms): number input fires valueChanges twice. angular/angular#36087
    • バグの上に成り立っていた処理が壊れる可能性があるため注意
  • ! length系の組み込みバリデータがnumberに対して常にvalidとなるように修正
    • fix(forms): handle numeric values properly in the validator  angular/angular#36157
  • ! unknown property/elementエラーがconsole.errorで出力されるように修正
    • fix(core): log error instead of warning for unknown properties and elements angular/angular#36399
  • ! Resolverが返すObservableがnextせずにcompleteしたときにナビゲーションをキャンセルするように修正
    • fix(router): empty resolvers cancel navigation angular/angular#24621
  • ! AsyncPipeがWrappedValueを使わず値をそのまま返すように修正
    • refactor(common): remove WrappedValue from AsyncPipe angular/angular#36633
    • これまで検出できなかった変更検知エラーが検出できるようになる
  • ! DatePipeの DayPeriod が日付をまたぐときの出力を修正
    • fix(common): format day-periods that cross midnight angular/angular#36611
    • フォーマットに b や B を使っている人は注意

CLI

• feat: tsconfigのSolution Style対応
  • feat(@schematics/angular): add solutions style tsconfig structure angular/angular-cli#17586
  • tsファイルがどのコンフィグに属するのかをエディタが探しやすくなる
  • ng updateで移行 / ng newでデフォルト
• feat: Yarn PnP 対応 (Yarn v2)
• feat: CommonJSのimportに警告を出す（オプトアウト）
  • 参考: https://web.dev/commonjs-larger-bundles/
• feat: ng newの新規アプリのサポートブラウザがevergreenのみになった
  • feat(@schematics/angular): evergreen new applications angular/angular-cli#17361
  • IE11はデフォルトで含まれないため .browserslistrc でオプトイン
  • --legacy-browsersオプションも追加
• feat: --strictオプションの効果範囲の拡大
  • feat(@schematics/angular): enable stricter type checking and optimization effective coding rules  angular/angular-cli#17372
  • bundle budget: initial 5MB -> 1MB
  • strictTemplates 有効
  • ng new時にプロンプトでy/N選択
• feat: ワークスペースのtsconfigのデフォルトtarget/moduleを変更
  • feat(@schematics/angular): update compiler options target and module settings angular/angular-cli#17637
  • module は esnext => es2020
  • E2Eプロジェクトのtarget は es5 => es2018
• feat!: ng get/setコマンドの削除
  • refactor(@angular/cli): remove deprecated get/set commands angular/angular-cli#17658
• feat!: es5BrowserSupport オプションの削除
  • https://github.com/angular/angular-cli/pull/17484`
  • すでに非推奨。 .browserslistrcを使う
• feat: browserslist から .browserslistrcへ変更
  • feat(@schematcs/angular): change browserslist file name into .browserslistrc angular/angular-cli#17367
• feat: 新規UniversalアプリでLazy Loadingをデフォルト有効に変更
  • feat(@schematics/angular): enable lazy loading on the server for new projects angular/angular-cli#17352
• fix: 新規ライブラリはtslibがdependenciesに入るように修正
  • fix(@schematics/angular): add tslib as a direct dependency for new libraries angular/angular-cli#17761
• fix: ng deploy が --configuration を受け付けるように修正
  • fix(@angular/cli): allow configuration option in ng deploy angular/angular-cli#17615
  • v9にも入ってる

Others

• material
  • https://github.com/angular/components/blob/master/CHANGELOG.md#1000-next2-wool-wind-2020-05-26
  • feat: DateRangePicker追加
    • Doc: https://next.material.angular.io/components/datepicker/overview#date-range-selection
    • Demo: https://stackblitz.com/edit/angular-wudjzd?file=src%2Fapp%2Fapp.component.html
  • feat!: HammerJS系のAPIの削除
• Angular Packaging Format (APF) 10.0
  • https://g.co/ng/apf
  • esm5 and fesm5 Removal (esm2015 / fesm2015は残る）
  • umd Removal plan
  • このままだとv11で消すけど使ってる話知ってる？っていう話がされてる
    • <script> でのユースケースがどれくらいあるか