i18n User Guide

The Apache APISIX Dashboard uses @umijs/plugin-locale to solve the i18n issues, in order to make the i18n more clear and reasonable, we would recommend to obey the following rules

Location of locale configuration

• Please put the global locales under src/locales.
• Please put each page's locale file under src/pages/$PAGE/locales folder.
• Please put the Component's locale file under src/components/$COMPONENT/locales folder, and we MUST import them manually

How to name the key for each locale filed

the key can be like this : [basicModule].[moduleName].[elementName].[...desc]

• what's the first tow levels? e.g: app.pwa, page.consumer, component.actionBar

• The subkeys are divided into $element + $description style e.g: app.pwa.message.offline, component.actionBar.button.nextStep

  • If the the text is the part of a element, we can use [elementNameProps] e.g: page.consumer.proTableColumns.username.
  • If there are two or more same level part locales of a element, we can add number suffix e.g: page.route.form.itemRulesExtraMessage1.path, page.route.form.itemRulesExtraMessage2.path.

• common texts, we should not repeat in other part, and the common locale key omit [elementName] would be better.

  • If the text is used in two or more places inside the module, we would recommend sharing the text in the module, e.g:page.route.parameterPosition.
  • If the text is used in two or more places between modules, we would recommend sharing the text globally, and addglobalas the moduleName,git e.g:component.global.confirm.

Global locale keys

we have already defined many global keys, before you do i18n, you can refer to those.

Recommended subkey naming

• Form

element	props	locale subKey
Form.Item	label	form.itemLabel
Form.Item	rules.required	form.itemRulesRequiredMessage
Form.Item	rules.pattern	form.itemRulesPatternMessage
Form.Item	extra	form.itemExtraMessage

Example:

'page.route.form.itemRulesExtraMessage.parameterName': '仅支持字母和数字，且只能以字母开头',
'page.route.form.itemRulesPatternMessage.apiNameRule': '最大长度应小于100',

• Input

element	props	locale subKey
Input	placeholder	input.placeholder

Example:

'page.route.input.placeholder.parameterNameHttpHeader': '请求头键名，例如：HOST',

• Button

element	props	locale subKey
Button	null	button

Example:

'page.route.button.returnList': '返回路由列表',

• Steps

element	props	locale subKey
Steps.step	title	steps.stepTitle

Example:

'page.route.steps.stepTitle.defineApiRequest': '设置路由信息',

• Select

element	props	locale subKey
Select.Option	null	select.option

Example:

'page.route.select.option.enableHttps': '启用 HTTPS',

• Radio

element	props	locale subKey
Radio	null	radio

Example:

'page.route.radio.staySame': '保持原样',

• ProTable

element	props	locale subKey
ProTable	columns.title	proTable.columnsTitle

ProTable usually appears in conjunction with forms, and columns title are same with form item label, so we recommend these title keys to be the common key in modules.