Skip to content

フォールバック

fallbackLocale: '<lang>' は、希望の言語に翻訳がない場合に使用する言語を選択するために使用します。

ロケールを使用した暗黙的なフォールバック

地域とオプションの方言を含む locale が指定された場合、暗黙的なフォールバックが自動的に有効になります。

例えば de-DE-bavarian は以下の順序でフォールバックします

  1. de-DE-bavarian
  2. de-DE
  3. de

自動フォールバックを抑制するには、後置の感嘆符 ! を追加してください。例: de-DE!

1つのロケールでの明示的なフォールバック

一部の項目は特定の言語に翻訳されていないことがあります。この例では、項目 hello は英語では利用可能ですが日本語ではありません:

js
const messages = {
  en: {
    hello: 'Hello, world!'
  },
  ja: {
  }
}

目的のロケールで項目が利用できない場合に (例えば) en の項目を使用したい場合は、createI18nfallbackLocale オプションを設定してください:

js
const i18n = createI18n({
  locale: 'ja',
  fallbackLocale: 'en',
  messages
})

テンプレート:

html
<p>{{ $t('hello') }}</p>

出力:

html
<p>Hello, world!</p>

デフォルトでは、fallbackLocale へのフォールバックにより2つのコンソール警告が出力されます:

txt
[intlify] 'ja' ロケールメッセージに 'hello' キーが見つかりません。
[intlify] 'hello' キーを 'en' ロケールで翻訳するのにフォールバックしました。

最初の警告メッセージは、翻訳関数 $t に渡されたキーが ja ロケールメッセージに存在しないことを示し、2番目の警告メッセージは en ロケールメッセージからローカライズされたメッセージを解決するためにフォールバックしたことを示しています。これらの警告メッセージは、Vue I18nのデバッグをサポートするために出力されます。

注意

これらの警告メッセージは、デフォルトでは開発モード (process.env.NODE_ENV !== 'production') でのみ警告され、本番環境では出力されません。

最初の警告(「キーが見つからない...」)を抑制するには、初期化時にレガシーアプリケーションAPIモードで silentTranslationWarn: true を設定するか、Composition APIモードで missingWarn: false を設定してください。

2番目の警告(「フォールバックして...」)を抑制するには、初期化時にレガシーアプリケーションAPIモードで silentFallbackWarn: true を設定するか、Composition APIモードで fallbackWarn: false を設定してください。

ロケール配列での明示的なフォールバック

複数のフォールバックロケールをロケール配列を使用して設定できます。例えば

javascript
fallbackLocale: [ 'fr', 'en' ],

決定マップでの明示的なフォールバック

より複雑なフォールバックロケールの決定マップが必要な場合は、関連するフォールバックロケールを持つ決定マップを定義できます。

次の決定マップを使用します:

javascript
fallbackLocale: {
  /* 1 */ 'de-CH':   ['fr', 'it'],
  /* 2 */ 'zh-Hant': ['zh-Hans'],
  /* 3 */ 'es-CL':   ['es-AR'],
  /* 4 */ 'es':      ['en-GB'],
  /* 5 */ 'pt':      ['es-AR'],
  /* 6 */ 'default': ['en', 'da']
},

これにより以下のフォールバックチェーンが得られます:

ロケールフォールバックチェーン
'de-CH'de-CH > fr > it > en > da
'de'de > en > da
'zh-Hant'zh-Hant > zh-Hans > zh > en > da
'es-SP'es-SP > es > en-GB > en > da
'es-SP!'es-SP > en > da
'fr'fr > en > da
'pt-BR'pt-BR > pt > es-AR > es > en-GB > en > da
'es-CL'es-CL > es-AR > es > en-GB > en > da

フォールバック時の補間

言語にキーの翻訳がない場合に、翻訳キー上でテンプレート補間を行うよう fallbackFormat: true を設定します。

翻訳のキーは文字列なので、特定の言語向けのユーザーが読めるメッセージをキーとして使用できます。 例:

javascript
const messages = {
  ja: {
    'Hello, world!': 'こんにちは、世界!'
  }
}

これは、「Hello, world!」という文字列を英語に翻訳する必要がないため便利です。

実際、キーにテンプレートパラメータを含めることもできます。fallbackFormat: true と一緒に使用することで、"ベース"言語のテンプレートを記述する必要がなくなります。キーがそのままテンプレートとなります。

javascript
const messages = {
  ru: {
    'Hello {name}': 'Здравствуйте {name}'
  }
}

const i18n = createI18n({
  locale: 'ru',
  fallbackLocale: 'en',
  fallbackFormat: true,
  messages
})

テンプレートが以下のようになっている場合:

html
<p>{{ $t('Hello {name}', { name: 'John' }) }}</p>
<p>{{ $t('The weather today is {condition}!', { condition: 'sunny' }) }}</p>

以下の出力になります:

html
<p>Здравствуйте, John</p>
<p>The weather today is sunny!</p>