vue: nuxt-i18n: 无法翻译 keypath 的值答案

【问题标题】：vue: nuxt-i18n: Cannot translate the value of keypathvue: nuxt-i18n: 无法翻译 keypath 的值
【发布时间】：2019-06-14 19:54:01
【问题描述】：

我正在使用nuxt-i18n 翻译我的页面，但找不到翻译字符串。

我的设置：

nuxt.config.js

modules: [
    [
      'nuxt-i18n', {
        locales: [
          {
            code: 'en',
            name: 'English',
            iso: 'en-US',
            langFile: 'en_US.js',
          },
          {
            code: 'pt',
            name: 'Português',
            iso: 'pt-BR',
            langFile: 'pt_BR.js',
          },
        ],
        loadLanguagesAsync: true,
        langDir: 'locales/',
        defaultLocale: 'en',
      },
    ],
  ],

locales/en_US.js

export default {
  Greeting: 'Hello',
  Sign_up: 'Sign up',
};

文件.vue

{{ $t('Greeting') }}

控制台：

警告 [vue-i18n] 无法翻译 keypath 'Login' 的值。采用 keypath 的默认值。

【问题讨论】：

为了后代。如果您没有在语言环境文件后适当地命名语言环境，您也会收到此消息（例如，en-us 与 en）

标签： vue.js internationalization nuxt.js

【解决方案1】：

解决方案是将惰性属性值设置为 true。下面是代码sn-p。

modules: [
    [
      'nuxt-i18n', {
        lazy:true,
        locales: [
          {
            code: 'en',
            name: 'English',
            iso: 'en-US',
            langFile: 'en_US.js',
          },
          {
            code: 'pt',
            name: 'Português',
            iso: 'pt-BR',
            langFile: 'pt_BR.js',
          },
        ],
        loadLanguagesAsync: true,
        langDir: 'locales/',
        defaultLocale: 'en',
      },
    ],
  ]

【讨论】：

对于“nuxt-i18n”：“^6.3.0”，设置lazy: true，因为loadLanguageAsync不存在
loadLanguagesAsync 在我的版本中不存在

【解决方案2】：

警告说明了一切 - 您没有在 en_US.js 文件中定义 Login 消息。

您肯定会在应用中的某个位置调用{{ $t('Login') }}。

【讨论】：

【解决方案3】：

我花了一个小时才弄清楚你不能设置你的langDir: 'i18n/'。显然有些事情搞砸了，因为模块本身也是这样命名的...... 将文件夹重命名为其他名称，例如“lang”修复了问题...

【讨论】：

【解决方案4】：

也许对我的情况非常具体，但万一这对任何人都有帮助。

我的后备语言环境丢失。它在 á .env 文件中定义并像这样获取：

defaultLocale: process.env.FALLBACK_LOCALE,

然而，我是第一次运行代码并且没有 .env 文件。

【讨论】：