JSRUN 用代码说话

UI 本地化

编辑教程

本地化

标准UI

请预先进行简单的步骤来为CLI UI提交另一种语言的翻译!

  • 运行navigator.languages或navigator.language为新的地区获取语言代码。例如:'fr'。

  • 搜索npm确认称为vue-cli-locale- <语言代码>的包是否已经存在。如果存在,则请通过PR为它做出贡献!如果没找到,则创建一个新的称为vue-cli-locale- <语言代码>的地区的包。例如:vue-cli-locale-fr。

  • 将地区的JSON文件放置在一个locales文件夹中将该文件命名为语言代码。例如:locales / fr.json。

  • 在package.json文件中,设置unpkg扩展为区域文件的路径。例如:“ unpkg”:“ ./locales/fr.json”。

  • 将包发布到npm上。

翻译插件

你也可以在插件的根目录的locales文件夹中放置与 vue-i18n 兼容的区域文件。这样做会在项目打开的时候自动加载,然后你可以使用$ t在你的组件和vue-i18n辅助函数里翻译字符串。同样的UI API(像describeTask)用到的字符串将会进入vue-i18n,这样你就可以对它们进行本地化。

示例locales文件夹:

vue-cli-plugin/locales/en.json
vue-cli-plugin/locales/fr.json

API的用法示例:

api.describeConfig({
  // vue-i18n 路径
  description: 'com.my-name.my-plugin.config.foo'
})

请确定为id设置正确的命名空间,因为它需要跨所有插件保持唯一。推荐使用反向域名记号(反向域名表示法)。

在组件中使用的示例:

<VueButton>{{ $t('com.my-name.my-plugin.actions.bar') }}</VueButton>

可以使用ClientAddonApi在一个客户端addon加载地区文件:

// 加载本地文件 (使用 vue-i18n)
const locales = require.context('./locales', true, /[a-z0-9]+\.json$/i)
locales.keys().forEach(key => {
  const locale = key.match(/([a-z0-9]+)\./i)[1]
  ClientAddonApi.addLocalization(locale, locales(key))
})
JSRUN闪电教程系统是国内最先开创的教程维护系统, 所有工程师都可以参与共同维护的闪电教程,让知识的积累变得统一完整、自成体系。 大家可以一起参与进共编,让零散的知识点帮助更多的人。
X
支付宝
9.99
无法付款,请点击这里
金额: 0
备注:
转账时请填写正确的金额和备注信息,到账由人工处理,可能需要较长时间
如有疑问请联系QQ:565830900
正在生成二维码, 此过程可能需要15秒钟