5-安装（npm i nuxt-i18n）

• 第一步：在config 文件中创建一个文件夹和我们的配置 i18n.js

  • 引入en.json、fr.json
  • locale: 'en',
  • fallbackLocale: 'en',
  • messages: { en, fr }

• 第二步：创建不同的翻译文件，用键值对存储

• 第三步：在配置文件nuxt.config.js中添加i18n库

  • 代码：

    • import i18n from './config/i18n'

      • vueI18nLoader: true,
      • defaultLocale: 'fr',
      • locales: [ { code: 'en', name: 'English' }, { code: 'fr', name: 'Français' } ],
      • vueI18n: i18n

  • 配置：

    • vueI18nLoader 是可选的，将使我们能够在 Vue 组件中编写翻译

• 第四步：让我们检查包是否正常运行：打开pages/index.vue， 并更新标题

  • {{ $t('message') }}

    • message是键值
  • 在这里， $t() 告诉我们的 Nuxt 应用程序使用key 基于所选语言的翻译版本。

• 第五步：让我们创建一个下拉菜单来选择语言

  • components/LanguageInput.vue目录

    • v-for="lang in $i18n.locales" :key="lang.code" :value="lang.code" {{ lang.name }}</option 让我们将此组件添加到我们的pages/Index.html文件中