Baseline対応のDOMの 型定義を作った 2026-07-08 Nihonbashi.js #11 

発表者紹介 uhyo 株式会社カオナビ フロントエンドエキスパート 実はTypeScriptに詳しい。 2 

Baselineとは ウェブ機能を、ブラウザサポート状況によって 分類するもの Baseline Newly available = 全てのブラウザで利用可能 Baseline Widely available = 全てのブラウザで利用可能 になってから30ヶ月が経過 3 

固定ターゲット Baseline 2023 = 2023年までにNewly availableに なった機能 Baseline 2024, Baseline 2025, …… 4 

開発でよくある推奨環境の決め方 •推奨環境: 各ブラウザの最新版 = Baseline Newly Available に対応 •より広くサポートしたい（大抵はiOS） = Baseline Widely Available やBaseline 2024 などを使用 5 

型チェックしたい 例: Baseline Widely Availableではない機能を 使おうとしたら型エラーになってほしい。 （eslint-plugin-baseline-jsもあるけど型情報が必要な野良プラグインは 今ちょっと辛い立ち位置） 6 

@baseline-types/dom-widely-available TypeScript本体のLib Replacement機能を使用 して、DOMの型定義をBaseline Widely Available に合わせたライブラリを作りました。 7 

導入方法 8 @baseline-types/dom-widely-availableを、 @typescript/lib-domという名前でインストール。 

導入方法 9 tsconfig.jsonでlibReplacementを有効化。 これにより@typescript/lib-domが認識される ようになる。 

結果 Newly Availableなメソッドを使うと型エラーが出 るようになった！ 10 

バリエーション @baseline-types/dom-widely-available @baseline-types/dom-newly-available @baseline-types/dom-2022 @baseline-types/dom-2023 @baseline-types/dom-2024 @baseline-types/dom-2025 11 

バリエーション @baseline-types/dom-newly-available に変えると 型エラーが消えるぞ！ 12 

仕組み TypeScriptのTypeScript-DOM-Lib-Generatorを フォーク。 すでにあるもの: WebIDLから型定義を生成 作ったもの: 型をBaselineの情報を使ってフィルタ リングする仕組み https://github.com/uhyo/TypeScript-Baseline-Types 13 

週1自動更新 毎週自動更新で最新のBaseline情報をお届け。 バージョン名に日付を含めたのでいつ時点の 情報か分かりやすい！ 14 

今後の展望 全部AIにやってもらったので若干フィルタリング 結果が怪しいときがある。引き続き調整します。 DOM以外（ECMAScript）のBaseline対応も したら面白そうだけど全然違う仕組みが必要に…… 15 

まとめ @baseline-types/dom-widely-availableとかを 使って型でBaseline対応しよう！ 16