国际化

语言国际化通过 react-intl 库实现。React 客户端开箱支持几种语言。

下列翻译由核心开发团队维护。也就是说，每次一个新版本发布，这些翻译也能及时更新。

  • 英语

  • 俄语

下列翻译由社区提供。即，这些翻译可能需要一些时间才能更新。通过 提PR 的方式帮助我们更新。

  • 中文

  • 法语

添加新的本地化内容

  • 添加本地化消息至 src/i18n/<locale>.json 文件

  • 使用标准的 react-intl 组件或 API 在您的代码中使用国际化翻译，参阅 react-intl 文档。

重写已有消息

直接在 src/i18n/<locale>.json 文件内修改即可。通过这种方式可以覆盖客户端 App、CUBA React UI 组件甚至一些 Ant Design 组件内的消息。

添加对新本地化的支持

  • 添加对应的 <locale>.json 消息包。注意需要包含 CUBA React UI 组件（以 cuba-react 开头的键值）以及 Ant Design Form 验证的消息（以 antd.form.validation 开头的键值）

  • 修改 src/i18n/i18nMappings.ts 内的 messagesMapping 创建一个 locale 和消息包的映射。

  • 修改 src/i18n/i18nMappings.ts 内的 antdLocaleMapping 创建一个 locale 和 antd/es/locale-provider/Locale 的映射。因为 Antd 组件的文本翻译都是通过告诉 Antd 使用一个预定义的 locale 设置而实现的。Antd 支持的 locales 可以在 这里 找到。

  • 在 index.tsx 中添加对应的 moment locale 引入。比如 import 'moment/locale/ru';。因为部分 Antd 组件使用了 moment 中的本地消息。

  • 添加切换至新 locale 的文本，比如，使用默认的 LanguageSwitcher 时，为其添加一个新的选项。