csT 自动代码补全插件
功能特点
- 在输入csT('...')函数时,随着第一个参数内容的变化,插件尝试基于第一个参数内容填充后续的参数
- 常量文件中,针对固定的对象格式,当对中文value进行选中时,进行下方 code: 'i18nKey'自动插入补全或者更新
- 提供手动刷新数据源的命令
command + shift + p
=> csT: 刷新I18n数据源
安装
- 在VSCode扩展商店中搜索"csT Completion Tool"
- 点击安装
- 重启VSCode
使用方法
配置
- 在项目根目录创建
i18n.config.json
文件:
备注:如果没有找到配置文件,则插件内部会用默认的海外工作台dev环境的数据作为兜底
{
"env": "dev", // 否则认为是正式环境
"namespaces": [
{
"projectId": 1001, // 项目ID
"namespaceId": "your-namespace" // 命名空间ID
}
]
}
补全场景说明
1. csT函数代码补全
当你在Vue、JavaScript或TypeScript文件中输入csT('xxx')
,插件会基于获取的xxx内容尝试从i18n平台获取对应key,然后进行参数补全
- 实时输入:
csT('刷新失败')
→ csT('刷新失败', 'sep_refresh_error')
- 复制粘贴:
csT('取消')
→ csT('取消', 'sep_cancel')
2. 常量文件补全
第1种情况,插入补全
const data = [
{
text: '确认',
},
]
当对 确认
文字进行选中时,触发下方代码补全
const data = [
{
text: '确认',
code: 'cs_confrm',
},
]
第2种情况,更新补全
const data = [
{
text: '确认',
code: 'cs_cancel',
},
]
当对 确认
文字进行选中时,触发下方代码i18nKey的更新
const data = [
{
text: '确认',
code: 'cs_confrm',
},
]
手动刷新数据
通过命令面板(Cmd+Shift+p)执行CST: 刷新I18n数据源
命令可以手动刷新数据。
备注:一般情况下不需要主动刷新。
支持的文件类型
- Vue (.vue)
- JavaScript (.js, .jsx)
- TypeScript (.ts, .tsx)
开发
依赖安装
yarn install
编译
yarn watch
测试
在调试视图中运行"Extension Tests"配置。
打包
yarn package