给大家安利一款我开发的 VSCode 多语言插件

写在前面： ---这款插件主要用户是谁？有多语言场景(项目支持中文、英文、日文、韩文等多种语言)的前端开发者。 ---我的项目没有多语言场景，安装你这个插件干嘛？可以体验一下嘛，然后看看源码，插件包含的知识点还有趣的。 ---包含哪些知识点呢？ 1.完整的 VSCode 插件开发流程 2.tsc 编译 ts 文件 3.VSCode 文件热更新监测 4.利用缓存增量编译文件 

Github 地址： https://github.com/FrankKai/i18n-chain

欢迎各位提 PR ，提 issue ！！！

i18n-chain

反向选择路径链多语言 vscode 插件。

通过分析本地项目的多语言文件(js 、ts 、json)，生成 snippet.json ，帮助开发者实现多语言快速复用，提升开发效率。

演示图

https://imgur.com/tO0oXjk.gif

两种方式

• i18n-json: 适用于 locales 文件类型为 json 的项目。
• i18n-ts: 适用于 locales 文件类型为 ts file 的项目。

安装及使用

1. 插件市场搜索 i18n-chain ，安装即可
2. 配置多语言文件目录 Preferences->Settings->User->Extensions->i18n-chain(例如，配置 Locale Path ，默认路径为 /src/locales/zh)
3. Command+Shift+P => i18n-json(Locale Path 目录中的内容为 json 文件) 或者 Command+Shift+P => i18n-ts （ Locale Path 目录中的内容为 ts 文件）
4. 键入 i18n-后选择需要的链即可。

例如：

{ "foo": "知道了", "foo.bar": "知道了", "foo.bar.baz": "知道了", } 

i18n-知道了 

=>

1.foo 2.foo.bar 3.foo.bar.baz 

=>

foo.bar.baz 

原理图

FAQ

生成失败

运行命令后，可以查看.vscode 目录下的 i18n-chain.code-snippets 是否有内容。 没有的话，检查 Locale Path 配置的目录格式，是否与执行的命令一致。

开发说明

开发调试

• vscode 执行 Extension
• 找一个扩展开发宿主项目测试
• 插件代码有更新时，需要yarn compile编译并且点击右上角刷新按钮，保持扩展开发宿主内的插件为最新态

仅编译

yarn test-compile 

生成本地 vsix 包

yarn build 

欢迎各位提 PR ，提 issue ！！！