一个辅助国际化显示的 vscode 插件
- 定义位置与应用位置的相互跳转
- 从剪切板搜索(cmd+shift+v)
- 生成字段使用报告(使用 vscode 命令
generate the locale using report)
- 从应用点 hover 显示定义位置及多语言值
- 从定义位置 hover 显示应用列表及应用行文本
- 支持复制
- 快捷键(cmd+shift+v)查找值
- 支持用户设置 locale 路径
- 支持检测未使用或定义不完全的字段
- def 文件内展示应用还是定义列表
- 生成多语言使用报告
- 请求远程多语言
- 支持修改key名字
| 设置名 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| define | { include: string; exclude: string }[] | 定义文件包含:(使用 vscode glob) | |
| apply | { include: string; exclude: string }[] | 应用文件包含:(使用 vscode glob) | |
| detectApplyWay | "reg" | "split" | split | 检测应用节点的方式 reg:正则匹配(会有缺失)); split:分词在 def 中查找(会有多余) |
| defSelect | "key" | "value" | "key and value" | value | 跳转定义文件时选择字段的哪些部分 |
| pathSlice | boolean | true | 显示路径时去除 src 之前的部分 |
| remoteLocaleENV | develop | staging | production | production | 远程请求多语言的环境 |
"reg"：i18n format 函数正则匹配(由于情形众多无法全部匹配，会有缺失);
"split"：文本使用分号分词，逐个在定义列表中查找的方式确定是否为 i18n key(由于不通过 format 函数名匹配，会有多余);
- 为了简单直接，插件只监听文件的修改(节流 1s)，不监听文件删除，重命名等行为
- 使用定义文件的文件名作为语言显示
- 所有位置存储 base-one
- 内部借助包转化为 ast 获取位置，因此字段定义文件内不能有语法错误
按f1显示所有命令，搜索replace all css value using my css design token并确定，即会尝试替换 css 值为对应 css 变量。
| 设置名 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| useTokenReplace | boolean | false | 是否开启主题升级功能 |
| tokenLink | string | https://assets.shoplazza.com/sds/0.1.62/design-tokens.css | 主题升级的 css 链接 |
| includeGlob | string | src/*/.{css,less,sass,scss} | 主题升级涉及文件包含:(使用 vscode glob) |
| excludeGlob | string | **/{node_modules,dist,out,test}/** | 主题升级涉及文件排除:(使用 vscode glob) |
- 当存在一个 css 变量对应时，会直接替换(建议在 git 里检查)
- 当不存在 css 变量对应时，会添加
warn提示(黄色波浪底线和弃用横线)
- 当存在多个 css 变量对应时，会添加
info提示(蓝色波浪底线)。在光标聚焦后,可通过 hover 的快速修复...选择替换哪个 css 变量，或者用快捷键cmd+.选择
info提示也可在问题中快速选择替换哪个变量，详情见 gif