1. vip3-i18n

国际化语言解决方案，支持：

• 扩展了vue-i18n，实现了按模块动态迟加载多语言资源
• 动态切换语言环境

2. 快速开始

安装依赖

npm install @zhoujianhui/vip3-i18n

注册组件

import createI18n from "@zhoujianhui/vip3-i18n";
import App from "./App";

(async () => {
    // 创建应用
    const app = await createApp(App)

    if (app) {
        // 注册语言国际化组件
        const i18n = await createI18n([配置选项])
        app.use(i18n)

        app.mount("#app")
    }
})()

配置选项其中：

• locale：语言代码（可选，默认为：当前浏览器环境语言）
• fallbackLocale：默认语言代码（可选，默认为：“zh-CN/中文”）
• messages：各语言文本（可选，默认从各模块动态加载）

使用语言资源

<template>
  <div>
    <p>{{ $t("sample.hello") }}</p>
  </div>
</template>

$t 是 vue-i18n 插件提供的一个方法，用于在应用中进行文本的国际化翻译。“sample.hello” 是语言资源文件中的键。

设置语言环境

import {i18nManager} from "@zhoujianhui/vip3-i18n";

await i18nManager.changeLocale(this.$i18n, locale)

$i18n 是vue-i18n 插件实例。

2.1. 语言资源文件

语言资源文件位于每个模块的 “assets/locale/<语言代码>.json” 中。格式为：

{
  "<模块名>": {
    "<键名>": "<消息文本>"
  }
}

例如：

zh-CN.json

{
  "sample": {
    "hello": "你好，世界！"
  }
}

en-US.json

{
  "sample": {
    "hello": "Hello,World！"
  }
}

ja-JP.json

{
  "sample": {
    "hello": "こんにちは、世界！"
  }
}