延迟加载翻译

对于包含大量翻译内容的应用程序，最好不要将所有消息打包在主包中，而是仅仅延迟加载用户所选择的语言。这可以通过 @nuxtjs/i18n 完成，让模块知道你的翻译文件的位置，以便在应用程序加载时或用户切换到另一种语言时动态导入它们。要启用翻译的延迟加载，请在配置 @nuxtjs/i18n 时按照以下步骤进行：

将 lazy 选项设置为 true（如果你想自定义某些选项，可以设置为配置对象）。
将 langDir 选项设置为包含你的翻译文件的目录（不能为空）。
将 locales 选项配置为一个对象数组，其中每个对象都有一个 file 键，其值为对应区域设置的翻译文件。
可选地，移除你可能通过 vueI18n 选项传递给 vue-i18n 的所有消息。
每个 file 可以返回一个 Object 或一个 function（支持 Promises）。

示例文件结构：

nuxt-project/
├── lang/
│   ├── en-US.js
│   ├── es-ES.js
│   ├── fr-FR.js
├── nuxt.config.js

配置示例：

nuxt.config.ts

i18n: {
  locales: [
    {
      code: 'en',
      file: 'en-US.js'
    },
    {
      code: 'es',
      file: 'es-ES.js'
    },
    {
      code: 'fr',
      file: 'fr-FR.js'
    }
  ],
  lazy: true,
  langDir: 'lang/',
  defaultLocale: 'en'
}

语言文件示例：

lang/en-US.ts

export default async (context, locale) => {
  return await Promise.resolve({
    welcome: '欢迎'
  })
}

// 或者

export default {
  welcome: '欢迎'
}

请注意，如果你想在导出的函数中使用 @nuxtjs/axios 模块中的 $axios 实例，则必须在 @nuxtjs/i18n 模块之后注册 @nuxtjs/axios 模块。实际上，这条规则同样适用于任何其他添加插件的模块，且你希望在该函数内部使用其功能。

延迟配置选项

lazy 选项可以分配一个配置对象，以自定义延迟加载行为。

支持的配置选项包括：

`skipNuxtState`

默认情况下，当前选择的语言的区域消息（除非它恰好是 fallbackLocale）会在服务器端注入到 Nuxt "state" 中，并在客户端重复使用。这种方式的好处是消息在客户端上可同步访问，从而避免额外的网络请求。缺点是这会使每个页面的服务器响应更大（特别是如果消息很多的话）。这适用于服务器端渲染和静态生成的网站。

启用 skipNuxtState 后，区域消息会从相应的 JavaScript 包加载（对于回退语言从主包加载，其他语言从它们自己的包加载）。这使得载荷更小，但意味着页面加载可能会由于额外的请求而变慢（尽管浏览器端缓存会尽量提供帮助）。

SEO

语言切换器