ロケール対応の型推論
すべてのロケールで同じキー構造が共有されるようにします。
「ロケール対応の型推論」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン4/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全4レッスンが含まれています。
ロケールを考慮した型推論
アプリでは複数のロケール（en、tr、de など）を提供します。ベースに存在するキーがどのロケールでも不足している場合にエラーになる型を用意し、翻訳が気付かないうちに同期ずれしないようにします。
ベースロケール
1 つのロケール（通常は en）を、正規のキー構造を持つロケールとして選びます。それ以外のすべてのロケールは、その形状に一致する必要があります。
const en = {
greeting: "Hello",
cart: { empty: "Empty", checkout: "Checkout" },
} as const;
type Base = typeof en;他のロケールを制約する
追加する各ロケールにベースと同じ形状の型を指定します。これで、そのロケールのファイルでキーが不足しているとコンパイルエラーになります。
const tr: Base = {
greeting: "Merhaba",
cart: { empty: "Bo\u015f", checkout: "\u00d6deme" },
};
// Omitting cart.checkout -> Error: property missing余分なキーも検出する
ベースの型をアノテーションとして使うと、ロケールには存在するもののベースには存在しない未知のキーにもフラグが立ちます。これにより、残っている不要なエントリや入力ミスのあるエントリも検出できます。
const de: Base = {
greeting: "Hallo",
cart: { empty: "Leer", checkout: "Kasse" },
extra: "oops", // Error: not in Base
};ロケールを定義するヘルパー
ジェネリックヘルパーで形状を強制しながら各値を保持できるため、ロケールごとにすっきりと定義できます。
function defineLocale<T extends Base>(loc: T): T {
return loc;
}
const fr = defineLocale({
greeting: "Bonjour",
cart: { empty: "Vide", checkout: "Paiement" },
});すべてのロケールのレジストリ
ロケールをレコードにまとめます。各値を Base に制約することで、アプリ全体で構造が統一されることを保証できます。
const locales: Record<string, Base> = { en, tr, de: fr };
// every entry must have the full Base key structure型レベルの等価性（深い比較）
より厳密に保証するには、キー構造を深く比較する SameKeys 型を作成できます。構造が異なる場合はエラー型に解決されるため、通常のアノテーションで検出できる範囲を超えて差異を検出できます。
type SameKeys<A, B> =
keyof A extends keyof B
? keyof B extends keyof A ? true : false
: false;キーを一度だけ導出する
すべてのロケールが Base を共有するため、キーのパス型（前のレッスンで扱ったもの）は Base から一度だけ計算し、すべてのロケールで再利用できます。そのため、t の型付けはロケールに依存しません。
type Key = LeafPaths<Base>;
// same valid keys regardless of active locale実行時のロケール選択
実行時には、現在アクティブなロケールを使ってレジストリをインデックスします。型システムによって各ロケールが同じキーを持つことはすでに保証されているため、安全に検索できます。
function translate(locale: keyof typeof locales, key: Key): string {
return getPath(locales[locale], key);
}ロケール間の不足キーを検出する
各ファイルに直接アノテーションを付けられない場合（JSON のインポートなど）は、ビルド時の型チェックでインポートした各ロケールと Base を比較し、不足しているキーを一覧にした差分型を示せます。
type Missing<L> = Exclude<keyof Base, keyof L>;
type TrMissing = Missing<typeof tr>; // never if completeこれが重要な理由
型付けされていない i18n では、キーを en に追加しても de への追加を忘れ、空の文字列や英語の文字列を出荷してしまうことがあります。すべてのロケールを共有のベースに制約すれば、その不足をコンパイルエラーに変え、すべてのロケールを完全かつ一貫した状態に保てます。
クイックチェック
ロケールを考慮した型推論についての理解度を確認します。
まとめ
ベースロケールを正規の形状として選び、それ以外のすべてのロケールをそれに制約しました。これにより、キーの不足や余分なキーがあるとコンパイルに失敗します。defineLocale ヘルパーと制約付きレジストリによって、すべてのロケールの構造が同一に保たれ、キーのパスはベースから一度だけ導出されます。
よくある質問
「ロケール対応の型推論」レッスンは無料ですか？
はい。「ロケール対応の型推論」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全4レッスンが含まれています。
「ロケール対応の型推論」で何を学びますか？
すべてのロケールで同じキー構造が共有されるようにします。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
TypeScript Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン4/4です。
「ロケール対応の型推論」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このTypeScript Academyレッスンでコードを書いて実行できますか？
はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。