# ng-japan OnAir vol.40 "Angular v12 リリース!"

ng-japan OnAirはAngular日本ユーザー会が主催するオンラインイベントです

https://community.angular.jp
connpass: https://ngjapan.connpass.com/event/213288/
shownote: https://hackmd.io/@lacolaco/HJ1b6zeuu
Slido: https://app.sli.do/event/z5o6wsnl

#Angular #ng_jp_onair

## アジェンダ

- Angular v12 リリース!
- イベント紹介
- ユーザー会Slack job-board開設のお知らせ

## Angular v12 リリース!

- [Angular v12 is now available | Angular Blog](https://blog.angular.io/angular-v12-is-now-available-32ed51fbfd49)
- [Updating Angular](https://angular.jp/guide/updating-to-version-12)
- [Angular Update Guide](https://update.angular.io/?locale=ja-JP&v=11.0-12.0)
- `ng update @angular/core@12 @angular/cli@12`

### ライブラリアップデート

コミュニティからのリクエスト/コントリビューション

- [HttpClient supports specifying request metadata](https://netbasal.com/new-in-angular-v12-passing-context-to-http-interceptors-308a1ca2f3dd)
- Http Intercepterからアクセスできるコンテキストメタデータの追加
- [Min and max Forms validators added](https://github.com/angular/angular/pull/39063)
- ビルトインの`min` / `max` バリデータの追加
- 既存のフォームに影響あり
- [`emitEvent` option for AbstractControl-based class methods](https://github.com/angular/angular/pull/31031)
- `emitEvent`オプションが無かったメソッドへの追加
- [Support APP_INITIALIZER work with observable](https://github.com/angular/angular/pull/33222)
- `APP_INITIALIZER`がObservableに対応
- [better ngZone checking for warning](https://github.com/angular/angular/pull/25839)
- ユニットテスト中のrouterのNgZoneチェックを改善

コアアップデート

- [nullish coalescing (??) support in templates](https://github.com/angular/angular/pull/41437)
- テンプレート式で `??` が利用可能に

### ツールアップデート

#### Ivy Everywhere

- Deprecate View Engine
- アプリケーションのView Engineを非推奨化
- `enableIvy: false`オプトアウトの削除
- Ivy Library Distribution by default
- [Upcoming improvements to Angular library distribution | Angular Blog](https://blog.angular.io/upcoming-improvements-to-angular-library-distribution-76c02f782aa4)
- 新規ライブラリでビルド出力形式をIvyネイティブ化
- [Ivy Language Service](https://goo.gle/ivy-language-service)
- Language ServiceのIvy対応
- `strictTemplates`対応

#### Stylish Improvements

- Transformation hook for inline resources (inline Sass support)
- `@Component({styles})`のインラインスタイルのプリプロセッサ対応(Sass, LESS, etc)
- `inlineStyleLanguage`オプション
- Tailwind native support
- TailwindCSSのネイティブサポート(11.2より)
- TailwindCSS 2.1からのJITモードにも対応

#### Change defaults

- Inline critical CSS in Universal, App Shell, and CSR by default
- v11から導入されたクリティカルCSSのインライン化をデフォルト有効化
- Enable strict mode by default
- `ng new` の `--strict`オプションをデフォルト有効化
- [Angular \- Strict mode](https://angular.jp/guide/strict-mode)
- TypeScriptコンパイルの厳格化
- Angularテンプレートコンパイルの厳格化
- パフォーマンスバジェットの削減
- Production builds by default
- `ng build` の `--configuration=production` をデフォルト化
- `--prod` オプションは非推奨化 (`ng build`と同じ)
- `ng update @angular/cli@12 --migrate-only production-by-default`
- [fix\(@angular\-devkit/build\-angular\): change several builder options](https://github.com/angular/angular-cli/commit/656f8d75a3368a5affd1c55145841123dafdb007)
- No E2E runner by default
- 非推奨のProtractorの同梱は終了
- `ng e2e`コマンドのオプトイン化
- WebdriverIO: `ng add @wdio/schematics`
- Cypress: `ng add @cypress/schematics`
- [RFC: Future of Angular E2E & Plans for Protractor](https://github.com/angular/protractor/issues/5502)
- No Linter by default
- 非推奨のTSLintとCoderyzerの同梱は終了
- `ng lint`コマンドのオプトイン化
- ESLint: `ng add @angular-eslint/schematics`

#### Angular DevTools

- [Angular DevTools](https://angular.jp/devtools)
- http://goo.gle/angular-devtools

### コンポーネントアップデート

- new Sass module system (`@use` syntax) and theming API
- Angular MaterialのSass APIが `@use`に対応
- `node-sass`から`sass`パッケージへの移行

### ドキュメンテーションアップデート

- [Contributor guides](https://angular.io/guide/contributors-guide-overview)
- コントリビューターのためのガイド
- Angularアクセシビリティコードラボ
- https://codelabs.developers.google.com/angular-a11y
- [Angular \- Content projection](https://angular.io/guide/content-projection)
- コンテンツプロジェクションのガイド

### 依存パッケージアップデート・非推奨化

- Production-ready webpack 5 support
- [TypeScript 4.2](https://devblogs.microsoft.com/typescript/announcing-typescript-4-2/)
- IE11 support deprecation
- [RFC: Internet Explorer 11 support deprecation and removal](https://github.com/angular/angular/issues/41840)
- v12のLTSと共にIE11サポートの終了
- v13から非サポート
- Transitioning from Legacy i18n Message IDs
- v11以前のi18nのメッセージIDを非推奨化
- Node.js v10 サポート終了

## ユーザー会Slack job-board開設のお知らせ

[job\-board チャンネル利用のルール \- General \- Discourse \| Angular Japan User Group](https://angular-japan.discourse.group/t/topic/309/2)

## イベント紹介

- [I/O Extended For Web developers](https://developersonair.withgoogle.com/events/ioextendedforwebjp)
- [ng\-sake vol\.19](https://ng-sake.connpass.com/event/213909/)

###### tags: `ng_jp_onair`