VSCode插件开发实战:获取系统语言环境与中英文切换配置

📅 发布时间:2026/9/28 18:16:14
VSCode插件开发实战:获取系统语言环境与中英文切换配置
1. 为什么插件一上架就被问“怎么是英文”你写了一个 VSCode 插件命令面板里全是中文提示自己用着挺顺。结果海外用户装完发来 issue菜单看不懂、报错像天书。更尴尬的是有些用户系统是中文但 VSCode 显示语言被单独设成了英文你的插件却还在硬编码中文文案——两边对不上。这就是 VSCode 插件国际化要解决的核心问题读取当前语言环境按语言加载对应文案并让用户能自己切换。它适合所有准备把插件发布到 Marketplace、或者团队内部多语言协作的开发者。整条链路其实就三件事拿到vscode.env.language、用 nls 文件组织多语言资源、在package.json里声明本地化入口。下面按可复制的顺序拆开讲每一步都给完整代码和验证动作。2. 前置准备TaoToken 与开发环境在动手写国际化之前先把环境理顺。我习惯用 TaoToken 来统一管理模型调用和编码辅助插件里如果要做 AI 补全、代码解释这类功能直接走它的 API 就行不用自己维护多套密钥。TaoToken 官网入口https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_contentAPI 地址不带 UTM直接用于代码里https://taotoken.net/api如果你只是做纯本地化的语言切换不涉及模型调用这一步可以跳过直接看第 3 节。但如果你打算在插件里加“AI 翻译当前选中文本”这类功能建议先把 API Key 配好。获取方式登录后进入控制台在 API Keys 页面新建一个 key复制保存。控制台https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_contentAPI Keyshttps://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content开发环境本身只需要 Node.js 18 和 VSCode。用官方脚手架起项目npm install -g yo generator-code yo code选择New Extension (TypeScript)生成后目录里会有package.json、src/extension.ts、tsconfig.json。接下来所有改动都围绕这几个文件。3. 可复制配置package.json 与 nls 骨架3.1 package.json 里的本地化声明VSCode 插件的国际化不是靠运行时判断而是靠package.json里的l10n字段指向资源目录。先看关键片段{ name: my-i18n-extension, displayName: My I18n Extension, version: 0.0.1, engines: { vscode: ^1.85.0 }, main: ./out/extension.js, l10n: ./l10n, contributes: { commands: [ { command: myI18n.showLang, title: %command.showLang.title% } ] } }注意l10n: ./l10n这一行它告诉 VSCode 去l10n目录找翻译文件。contributes里的title用%key%占位实际文案从 nls 文件读取。3.2 nls 文件骨架在项目根目录建l10n文件夹里面放两个文件l10n/ bundle.l10n.json bundle.l10n.zh-cn.jsonbundle.l10n.json是默认英文文案{ command.showLang.title: Show Current Language, message.currentLang: Current language: {0}, message.switchHint: Use Configure Display Language to switch. }bundle.l10n.zh-cn.json是简体中文{ command.showLang.title: 显示当前语言, message.currentLang: 当前语言{0}, message.switchHint: 可通过“配置显示语言”进行切换。 }文件名规则bundle.l10n.locale.jsonlocale 用 VSCode 的语言 ID比如zh-cn、zh-tw、ja、de。{0}是占位符运行时用参数替换。3.3 读取系统语言环境在src/extension.ts里核心就一行import * as vscode from vscode; export function activate(context: vscode.ExtensionContext) { const lang vscode.env.language; console.log(VSCode language:, lang); const disposable vscode.commands.registerCommand(myI18n.showLang, () { const msg vscode.l10n.t(message.currentLang, lang); const hint vscode.l10n.t(message.switchHint); vscode.window.showInformationMessage(${msg} ${hint}); }); context.subscriptions.push(disposable); }vscode.env.language返回的是当前 VSCode 显示语言的 ID比如en、zh-cn、zh-tw。它和系统语言不一定一致——用户在 VSCode 里单独设过显示语言这里拿到的就是设置后的值。vscode.l10n.t()会根据当前语言自动选对应的 nls 文件找不到就回退到默认英文。4. 验证请求切换语言后看结果配置写完按 F5 启动 Extension Development Host。新窗口里按CtrlShiftP输入Show Current Language会弹出当前语言。现在切换语言验证。在开发宿主窗口里按CtrlShiftP搜索Configure Display Language选择中文(简体)重启窗口。再次执行命令应该看到当前语言zh-cn 可通过“配置显示语言”进行切换。如果切到en则显示英文。这一步验证了三件事vscode.env.language读取正确、nls 文件被正确加载、占位符替换生效。如果你在插件里集成了 TaoToken 的模型调用可以顺手验证一下 API 是否通。用 curl 测curl https://taotoken.net/api/v1/chat/completions \ -H Authorization: Bearer $TAOTOKEN_API_KEY \ -H Content-Type: application/json \ -d { model: gpt-4o-mini, messages: [{role: user, content: ping}] }返回正常 JSON 就说明 key 和网络都没问题。模型对话入口https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content5. 本篇常见错排查5.1 命令标题还是英文没跟着切最常见的原因是package.json里title没写%key%而是直接写了英文。VSCode 只对%...%形式的占位符做本地化替换。检查contributes.commands[].title是否用了%command.showLang.title%。5.2 nls 文件名写错中文不生效locale 必须和 VSCode 的语言 ID 完全一致。zh-CN不行要写zh-cnzh_CN也不行。对照表里简体中文是zh-cn繁体是zh-tw。文件名大小写敏感建议全小写。5.3 改了 nls 文件但没生效nls 文件在扩展激活时加载改完要重启 Extension Development Host 窗口不是热重载。另外确认l10n路径是相对项目根目录的./l10n和l10n都可以但别写成src/l10n。5.4 vscode.l10n.t 报 undefinedvscode.l10nAPI 需要 VSCode 1.73并且package.json里engines.vscode要声明^1.73.0或更高。如果版本太低升级 VSCode 或改用vscode.env.language手动判断。5.5 用户系统中文但插件显示英文这通常是因为用户 VSCode 显示语言设成了英文。vscode.env.language返回的是 VSCode 显示语言不是操作系统语言。这是预期行为——插件应该跟随 VSCode 显示语言而不是系统语言。如果你确实需要系统语言得用 Node 的os模块或Intl.DateTimeFormat().resolvedOptions().locale但那和 VSCode 界面语言可能不一致慎用。6. 长期编码与 Agent 场景的接入建议如果你在做的是长期维护的插件项目或者要接 Agent 做自动化编码建议把模型调用统一走 TaoToken 的 Coding Plan省去自己管理额度和多模型切换的麻烦。接入文档里有完整的 SDK 示例和参数说明。Coding Planhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content接入文档https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content回到国际化本身最后补一个实用技巧在activate里把vscode.env.language存到context.globalState配合vscode.workspace.onDidChangeConfiguration监听语言变化就能在用户切换语言后不重启也更新界面文案。不过 VSCode 的语言切换本身需要重启窗口所以这个监听更多是给“插件内部自定义语言偏好”用的——比如你允许用户在插件设置里单独选语言那就用vscode.workspace.getConfiguration(myI18n).get(language)覆盖vscode.env.language优先级自己定。