このページとあなたの好きなAIアシスタントを使ってドキュメントを要約します
Intlayer MCPサーバーを統合することで、ChatGPT、DeepSeek、Cursor、VSCodeなどから直接ドキュメントを取得できます。
MCPサーバーのドキュメントを表示このページのコンテンツはAIを使用して翻訳されました。
英語の元のコンテンツの最新バージョンを見るこのドキュメントを改善するアイデアがある場合は、GitHubでプルリクエストを送信することで自由に貢献してください。
ドキュメントへのGitHubリンクドキュメントのMarkdownをクリップボードにコピー
ロケールマッパー
ロケールマッパーは、Intlayerアプリケーションで国際化データを扱うための強力なユーティリティです。ロケール固有のデータを変換・整理するための3つの主要な関数、localeMap、localeFlatMap、localeRecordを提供します。
ロケールマッパーの仕組み
ロケールマッパーは、ロケールに関する必要な情報をすべて含むLocaleDataオブジェクトを操作します:
コードをクリップボードにコピー
type LocaleData = { locale: LocalesValues; // 現在のロケールコード(例:'en', 'fr') defaultLocale: LocalesValues; // デフォルトのロケールコード isDefault: boolean; // これはデフォルトのロケールかどうか locales: LocalesValues[]; // 利用可能なすべてのロケールの配列 urlPrefix: string; // このロケールのURLプレフィックス(例:'/fr' または '')};
マッパー関数は、設定内の各ロケールに対してこのデータを自動的に生成し、以下を考慮します:
- 設定されたロケールリスト
- デフォルトロケールの設定
- デフォルトロケールがURLにプレフィックスされるかどうか
コア関数
localeMap
マッパー関数を使って各ロケールを単一のオブジェクトに変換します。
コードをクリップボードにコピー
localeMap<T>( mapper: (locale: LocaleData) => T, locales?: LocalesValues[], defaultLocale?: LocalesValues, prefixDefault?: boolean): T[]
例:ルートオブジェクトの作成
コードをクリップボードにコピー
import { localeMap } from "intlayer";const routes = localeMap((localizedData) => ({ path: localizedData.urlPrefix, name: localizedData.locale, isDefault: localizedData.isDefault, locales: localizedData.locales, defaultLocale: localizedData.defaultLocale,}));// 結果:// [// { path: '/', name: 'en', isDefault: true, locales: ['en', 'fr', 'es'], defaultLocale: 'en' },// { path: '/fr', name: 'fr', isDefault: false, locales: ['en', 'fr', 'es'], defaultLocale: 'en' },// { path: '/es', name: 'es', isDefault: false, locales: ['en', 'fr', 'es'], defaultLocale: 'en' }// ]
localeFlatMap
localeMapに似ていますが、マッパー関数がオブジェクトの配列を返し、それが単一の配列にフラット化されます。
コードをクリップボードにコピー
localeFlatMap<T>( mapper: (locale: LocaleData) => T[], locales?: LocalesValues[], defaultLocale?: LocalesValues, prefixDefault?: boolean): T[]
例: ロケールごとに複数のルートを作成する
コードをクリップボードにコピー
import { localeFlatMap } from "intlayer";const routes = localeFlatMap((localizedData) => [ { path: localizedData.urlPrefix, name: localizedData.locale, isDefault: localizedData.isDefault, }, { path: `${localizedData.urlPrefix}/about`, name: `${localizedData.locale}-about`, isDefault: localizedData.isDefault, },]);// 結果:// [// { path: '/', name: 'en', isDefault: true }, { path: '/about', name: 'en-about', isDefault: true }, { path: '/fr', name: 'fr', isDefault: false }, { path: '/fr/about', name: 'fr-about', isDefault: false }, { path: '/es', name: 'es', isDefault: false }, { path: '/es/about', name: 'es-about', isDefault: false }]
localeRecord
各ロケールをキーとし、マッパー関数によって変換された値をマッピングするレコードオブジェクトを作成します。
コードをクリップボードにコピー
localeRecord<T>( mapper: (locale: LocaleData) => T, locales?: Locales[], defaultLocale?: Locales, prefixDefault?: boolean): Record<Locales, T>
例: 翻訳ファイルの読み込み
コードをクリップボードにコピー
import { localeRecord } from "intlayer";const translations = localeRecord(({ locale }) => require(`./translations/${locale}.json`));// 結果:// {// en: { welcome: 'Welcome', hello: 'Hello' },// fr: { welcome: 'Bienvenue', hello: 'Bonjour' },// es: { welcome: 'Bienvenido', hello: 'Hola' }// }
ロケールマッパーの設定
ロケールマッパーは自動的にあなたのIntlayer設定を使用しますが、パラメータを渡すことでデフォルト設定を上書きすることができます。
デフォルト設定の使用
コードをクリップボードにコピー
import { localeMap } from "intlayer";// intlayer.config.tsの設定を使用const routes = localeMap((data) => ({ path: data.urlPrefix, locale: data.locale,}));
設定の上書き
コードをクリップボードにコピー
import { localeMap } from "intlayer";// ロケールとデフォルトロケールを上書きconst customRoutes = localeMap( (data) => ({ path: data.urlPrefix, locale: data.locale }), ["en", "fr", "de"], // カスタムロケール "en", // カスタムデフォルトロケール true // URLにデフォルトロケールをプレフィックスする);
高度な使用例
ナビゲーションメニューの作成
コードをクリップボードにコピー
import { localeMap } from "intlayer";const navigationItems = localeMap((data) => ({ label: data.locale.toUpperCase(), href: data.urlPrefix || "/", isActive: data.isDefault, flag: `/flags/${data.locale}.svg`, // 国旗のパス}));
サイトマップデータの生成
コードをクリップボードにコピー
import { localeFlatMap } from "intlayer";const sitemapUrls = localeFlatMap((data) => [ { url: `${data.urlPrefix}/`, lastmod: new Date().toISOString(), changefreq: "daily", priority: data.isDefault ? 1.0 : 0.8, }, { url: `${data.urlPrefix}/about`, lastmod: new Date().toISOString(), changefreq: "monthly", priority: data.isDefault ? 0.8 : 0.6, },]);
動的翻訳の読み込み
コードをクリップボードにコピー
import { localeRecord } from "intlayer";const translationModules = localeRecord(({ locale }) => ({ messages: import(`./locales/${locale}/messages.json`), // メッセージのインポート validation: import(`./locales/${locale}/validation.json`), // バリデーションメッセージのインポート metadata: { locale, direction: ["ar", "he", "fa"].includes(locale) ? "rtl" : "ltr", // 右から左への言語かどうかの判定 },}));
設定との統合
Locale MapperはIntlayerの設定とシームレスに統合されます:
- ロケール: configuration.internationalization.locales を自動的に使用します
- デフォルトロケール: configuration.internationalization.defaultLocale を使用します
- URLプレフィックス: configuration.middleware.prefixDefault を尊重します
これにより、アプリケーション全体で一貫性が保たれ、設定の重複が削減されます。
ドキュメント履歴
バージョン | 日付 | 変更内容 |
---|---|---|
5.7.2 | 2025-07-27 | ロケールマッパーのドキュメントを追加 |