国际化
He3 支持 11 种主流的国际语言，工具国际化是可选的，它分为两种类型：
- 工具元信息国际化
- 业务提示国际化
工具元信息国际化
He3 支持生成工具的国际化元信息，即生成 meta.locale.json 文件；用于底座渲染以及使用国际化信息。
1. 修改 package.json 中工具元信息
json
{
...,
"he3": {
...,
// 工具名
"name": "test name",
// 简介
"description": "test description",
// 关键字
"keywords": [
"test"
]
},
}
2. 执行 npm run i18n
执行该命令后会根据 package.json 中的数据生成 meta.locale.json 文件，并用于调试（npm run dev）与发版 (npm run publish)。
meta.locale.json 文件:
json
{
"en": {
"$name": "test name",
"$description": "test description",
"$keywords": [
"test"
]
},
"zh-cn": {
"$name": "测试名",
"$description": "测试简介",
"$keywords": [
"测试"
]
},
"ru": {
...
},
"zh-tw": {
...
},
"pt": {
...
},
"fr": {
...
},
"it": {
...
},
"ja": {
...
},
"ko": {
...
},
"de": {
...
},
"es": {
...
}
}
可通过手动修改
meta.locale.json文件，更新底座渲染的工具名与工具详情。 > 没有meta.locale.json文件的工具会自动使用package.json中的元信息。
业务提示国际化
业务提示国际化是指在业务中使用到的按钮、输入框提示、弹出提示等，你需要在工具 src 目录下手动创建 lang.json 文件。
json
{
"zh": {
"key": "值"
},
"en": {
"key": "value"
},
"de": {
...
},
"es": {
...
},
"fr": {
...
},
"it": {
...
},
"ja": {
...
},
"ko": {
...
},
"pt": {
...
},
"ru": {
...
},
"zh-tw": {
...
}
}
更多信息请参考示例应用的 lang.json 文件。
lang.json 文件创建完成后，就可以在 vue 文件中通过内置变量 $t('key') 访问它们，He3 会根据用户选择的语言来展示对应的国际化信息。
<div>
<h-multiline-input
v-model="input"
auto-select
:title="$t('input')"
@change="encode" />
</div>
更多信息请参考示例应用 index.vue 文件。