锐客网

  1. 首页 > 睿知 > it技术 > >

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

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

Github地址：https://github.com/FrankKai/i...
欢迎各位提PR，提issue！！！
i18n-chain 反向选择路径链多语言vscode插件。
通过分析本地项目的多语言文件(js、ts、json)，生成snippet.json，帮助开发者实现多语言快速复用，提升开发效率。
演示图

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



两种方式
  • 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.foo2.foo.bar3.foo.bar.baz

=>
foo.bar.baz

原理图
给大家安利一款我开发的VSCode多语言插件
文章图片

FAQ 生成失败
【给大家安利一款我开发的VSCode多语言插件】运行命令后，可以查看.vscode目录下的i18n-chain.code-snippets是否有内容。
没有的话，检查Locale Path配置的目录格式，是否与执行的命令一致。
开发说明 开发调试
  • vscode执行Extension
  • 找一个扩展开发宿主项目测试
  • 插件代码有更新时，需要yarn compile编译并且点击右上角刷新按钮，保持扩展开发宿主内的插件为最新态
仅编译
yarn test-compile

生成本地vsix包
yarn build

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

    推荐阅读


    上一篇：JS对象增删改查

    下一篇：go算法实现（快排 quick sort）