react-intl-universal-i18n

Features

这是一款react-intl-universal提示工具,提供以下功能:

• 代码提示: 显示所有语言提示
• 代码转换: 选中要转换的字符(可包含引号'"),打开vscode命令行输入i18nTransform
• 语言文件定义跳转: 默认跳转所有语言文件
• 语言key值补全
• 格式匹配: 默认intl.get('$1')

动图演示

代码提示

代码转换

定义跳转

key值提示

格式匹配

Extension Settings

• react-intl-universal-i18n.configPath
  • description: 多语言文件夹,默认为 src/locales ,如果是多语言文件夹位置,则填 string 类型,如果是远程 json 文件,则填 Array<string> 类型
  • type: string | Array<string>
  • default: src/locales or ["https://x.json","https://xx.json"]
• react-intl-universal-i18n.defaultDefinition
  • description: 多语言定义跳转文件,假如你选择了en,则默认跳转en语言文件,默认提供全部语言文件定义地址
  • type: string | string[]
  • default: ""
• react-intl-universal-i18n.regExp
  - description: 多语言匹配格式,如果你不是intl.get('$1')这种格式,可自定义配置其他格式,$1是匹配词,必须存在哦
  • type: string
  • default: "intl.get('$1')"
• react-intl-universal-i18n.watchMode
  • description: 多语言文件修改是否开启监听模式,修改完需重启项目才能生效,不支持远程json监听
  • type: boolean
  • default: false

实验性功能

命令

• i18nTransformAll
  • 一键搜索转换当前文档多语言文案
  • 本功能尚在实验阶段,请先 git add 之前的状态,再转换 git diff 手工校验一次;

设置

• react-intl-universal-i18n.import
  • 引入多语言对象的语句,默认 import {intl} from '@/utils/js/locales';
  • type: string
  • default: import {intl} from '@/utils/js/locales';

Issues

1 插件已提供监听功能

如果没有开启监听功能,当修改多语言文件内容后,请手动打开命令行输入i18nReload,作用是重新收集一次多语言文件内容 (注意:当修改完监听配置,需重启项目)

2 多语言文件有什么格式要求吗

格式如下

export default {
  title: "abc",
  name:"name"
};

获取多语言json是通过ast解析,支持ts,js格式,但不支持多层嵌套
如果是远程文件,只支持json格式

3 怎么改格式匹配

当你的项目并不是react-intl-universal文档规定的格式,比如是INTL.$t("title"),那么你可通过修改配置(注意双引号要加反斜杠转义)

"react-intl-universal-i18n.regExp":"INTL.$t(\"$1\")"

改完重启Vscode即可生效

4 实验性功能没有转换 intl.get('xx',{name:'xx'})

目前实验性功能只支持普通转换,不能支持intl.get('xx',{name:'xx'}) 自定义选项;