Skip to content
| Marketplace
Sign in
Visual Studio Code>Formatters>vscode-starlingNew to Visual Studio Code? Get it now.

vscode-starling

liubin

|
717 installs
| (1) | Free
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

vscode-starling

用于多语言文案管理 starling 的 vscode 插件。

特性

  • hover到i18n key时自动展示对应的翻译文案
  • 选中文本并hover时展示对应的翻译文案
  • 查找相似的翻译
  • 抽离代码中的中文,并完成国际化
  • 上传key到starling源文案
  • 上传翻译文案到starling源文案
  • 批量将JSON文案上传到starling源文案
  • 上传文件到源文案(当前仅支持json文件)
  • 创建starling namespace
  • 下载starling namespace翻译文件
  • 下载starling project翻译文件
  • 在starling站点上远程查找相关key
  • 在starling站点上远程查找相关源文案
  • 在starling站点上远程查找相关翻译文案
  • 一些相关的snippets

如何使用

插件依赖于一些配置项才能起作用:

名称 描述 是否必填 默认值
root 本地starling文案的根目录或文件,可填入多个。 如果是相对路径,会在编辑器打开的项目中查找第一个匹配的;如果是绝对路径,直接加载 否 ['src/lang/_starling']
includes 文件类型过滤器,只加载根目录下匹配后缀的文件 否 ["json"]
sid starling 用户id,在使用插件的远程功能时用于api鉴权。 进入starling站点控制台查看starling_sid这个cookie。 否
pid starling项目 id(会在页面 url 展示),远程搜索时如果配置了pid会只在此项目中搜索,否则需要手动选择项目 否

在修改配置后,插件会自动重启并激活一系列功能。

一个配置示范:

config_demo

用法

注:当前只配置了插件在js、ts、jsx、tsx、vue、json文件里生效,若有需求在其他类型文件生效可联系我 😺

1. hover到i18n key时自动展示对应的翻译文案

当鼠标悬停在一个vue-i18n的key上时,自动展示这个 key 对应的文案翻译

hover-on-i18n-key

2. 选中文本并hover时展示对应的翻译文案

当选中一些文本时并hover时,会自动将这些文本当做key并展示对应文案翻译

hover-on-selection

3. 查找相似的翻译(快捷键Command + F11)

relative_trans

4. 抽离代码中的中文,完成国际化

此功能是合并自magic-i18n 插件,已征得原作者同意并授权。

  1. 打开一个js/vue/jsx/ts/tsx文件,然后右键:

    file conveter

  2. 也支持对整个文件夹的国际化

    folder-convert

  3. 国际化后会自动将文件中的中文替换成你配置的函数调用,并将中文抽离出来(默认抽离到本地的 cn.json 文件中):

    result

更详细的用法参见说明文档

5. 上传key到starling源文案

add_key_2_starling

6. 上传翻译文案到starling源文案

add_text_2_starling

7. 批量将JSON文案上传到starling源文案

add_json_2_starling

8. 上传文件到源文案(当前仅支持json文件)

add_file_2_starling

9. 创建starling namespace

create_namespace

10. 下载starling namespace翻译文件

download_namespace

11. 下载starling project翻译文件

download_project

12. 在starling站点上远程查找相关key(快捷键CMD + F7)

remote_search_key

13. 在starling站点上远程查找相关源文案(快捷键CMD + F8)

remote_search_key

14. 在starling站点上远程查找相关翻译文案(快捷键CMD + F9)

remote_search_key

15. 一些相关的snippets

snippets

snippets 的具体信息如下:

prefix snippets content 作用范围
t' $t('key') js、ts、vue script、vue template
te' $te('key') js、ts、vue script、vue template
tt' this.$t('key') js、ts、vue script
tte' this.$te('key') js、ts、vue script
ct' const { $t } = this; js、ts、vue script
cte' const { $te } = this; js、ts、vue script
t'} {{ $t('key') }} vue template
te'} {{ $te('key') }} vue template
vt' v-t="'${key}'" vue template

可使用Command + Option + P吊起命令面板后,输入starling以查找相关支持的命令:

commands

同时也将一些常用命令加入了右键菜单(需要选中文本才会出现starling菜单命令):

menu_cmd

  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2023 Microsoft