Vscode插件国际化多语言的坑
方法一
直接用变量,如下所示:
const MESSAGES = {
'zh-cn': {
inputParam: (name: string) => `请输入参数: ${name}`,
replacePlaceholder: (ph: string) => `替换 ${ph}`,
btnImport: '导入配置文件',
btnExport: '导出配置文件',
btnOverwrite: '确定覆盖',
btnConfirm:'确定',
},
'en': {
inputParam: (name: string) => `Input parameter: ${name}`,
replacePlaceholder: (ph: string) => `Replace ${ph}`,
btnImport: 'Import configuration',
btnExport: 'Export configuration',
btnOverwrite: 'Overwrite',
btnConfirm:'confirm',
}
} as const;
const lang = vscode.env.language.toLowerCase();
const t = lang.startsWith('zh') ? MESSAGES['zh-cn'] : MESSAGES['en'];
//调用
const label = await vscode.window.showInputBox({ prompt: t.btnImport});
const confirm = await vscode.window.showWarningMessage(
t.inputParam(node.label),
{ modal: true },
t.btnConfirm
);
方法二
也就是我最想说的l10n包,这个的坑点,不要想当然,更不要太相信AI,一个变量,然后翻译两次,结果就中文它的结果调用可以,英文却调用来调去,就是调不出来,问了AI半天就是解决不了,后面看了一下别人的帖子才明白,这就是个坑。
很重要的一点就是,vscode.l10n.uri是VSCode提供给Extension Host(扩展主进程),只有当用户当前使用的语言不是英语(默认语),并且你提供了对应语言的本地化文件时,这个才会有值,说人话就是这个东西本身就是一个键值,所以才会出现上面的情况,下面来使用一下。
1、在package.json中添加属性
{
"l10n": "./l10n"
}
2、安装依赖项
npm install @vscode/l10n
3、在代码中使用
import * as vscode from 'vscode';
vscode.window.showErrorMessage(vscode.l10n.t('Please configure working directory.'));
vscode.window.showErrorMessage(vscode.l10n.t('Packaging failed: {0}',errorMsg));
const confirm = await vscode.window.showWarningMessage(
vscode.l10n.t('Are you sure.'),
{ modal: true },
vscode.l10n.t('Confirm')
);
if (confirm === vscode.l10n.t('Confirm')) {
}
4、执行资源提取命令
执行以下命令,从 src 目录中提取所有字符串,以形成国际化 JSON 文件。
npx @vscode/l10n-dev export --outDir ./l10n ./src
5、翻译JSON文件
执行完命令,你会得到bundle.l10n.json这个文件,而最坑也就是这,这个文件不是配置英文的,它是一个模板最后打包时可以删除它,因为默认是英文根本就不加载,比如上面的'Are you sure.'与'Confirm'它就是变量本身,它的作用只有一个,就是生成这文件后交给AI翻译,让ai保持左边不动翻译右边的,最后按照bundle.l10n.<locale>.json格式重命名,中文就改名成bundle.l10n.zh-cn.json放到l10n文件夹里面,默认不加载只要安装了中文插件包才加载,也就是'Packaging failed: {0}'就是变量本身,就这一点不明白的话就很坑。
{
"Please configure working directory.": "请先配置工作目录",
"Packaging failed: {0}":"打包失败: {0}",
"Are you sure.":"你确定吗?",
"Confirm":"确定"
}
而配置好的文件,应该像上面一样,左边都是英文,右边可以翻译成不同的语言,每多一个语言就多一个json文件,都是bundle.l10n.<locale>.json来命令,很重要的一个点就是,必须明白的左边它就是变量名可以用工具来生成,这想法也真天才,不过坑也是真坑。
参考:
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐



所有评论(0)