1、创立locales文件夹,存放翻译文件
en-US:
export default {
'OK': 'OK',
'Cancel': 'Cancel',
}
zh-CN:
export default {
'OK': '确定',
'Cancel': '取消',
}
import pages from './en-US/pages';
export default {
...pages
};
2、.umirc.ts文件中(默认打包语言为中文)
locale: {
default: 'zh-CN',
antd: true,
baseNavigator: true,
},
3、package.json中设置打包、运行脚本
{
"name": "bench",
"private": true,
"scripts": {
"start": "umi dev",
"///": "国内版本使用start命名",
"start:zh": "cross-env BUILD_ENV=zh-CN umi dev",
"////": "海外版本使用start命令",
"start:nzh": "cross-env BUILD_ENV=not-zh-CN umi dev",
"build": "umi build",
"/": "编译国内版本使用build命名",
"build:zh": "cross-env BUILD_ENV=zh-CN umi build",
"//": "编译海外版本使用命令",
"build:nzh": "cross-env BUILD_ENV=not-zh-CN umi build",
"postinstall": "umi generate tmp",
"prettier": "prettier --write '**/*.{js,jsx,tsx,ts,less,md,json}'",
"test": "umi-test",
"test:coverage": "umi-test --coverage",
"lint": "eslint ./src --ext .tsx --ext .ts",
"lint:fix": "eslint ./src --ext .tsx --ext .ts --ext .js --ext .jsx --fix",
"eslint": "eslint --ext .js --ext .jsx --ext .tsx --ext .ts ./src -f html -o eslint.html"
},
}
4、在typings.d.ts中声明国际化用法
declare const intl: {
formatMessage: ({ id }: { id: string, [key: string]: any }, { other }?: { [key: string]: any }) => string,
locale: 'en-US' | 'zh-CN',
// separator: '&' | ',',
// 现在中英文统一用符号“|”
separator: '|' | '|',
[key: string]: any
};
5、项目中使用
{
title: intl.formatMessage({ id: 'Remark' }),
dataIndex: 'remark',
align: 'center',
ellipsis: true
}