npm 包 tomelo 使用教程

什么是 tomelo

tomelo 是一个用于管理应用程序中的多语言文件的 npm 包。通过 tomelo，您可以轻松地添加、更改或删除已翻译的文本，并将其用于应用程序中。

安装

您可以通过 npm 安装 tomelo：

npm install tomelo --save

基本用法

初始化

在开始使用 tomelo 之前，您需要进行初始化来设置语言及要使用的本地服务。

import Tomelo from 'tomelo';

const tomelo = new Tomelo({
  lang: 'en-US',
  url: './locales/{{ lang }}/{{ ns }}.json'
});

在上面的代码示例中，我们创建了一个 tomelo 实例，并使用了 en-US 作为默认语言和 /locales/{{ lang }}/{{ ns }}.json 作为本地服务地址。其中，lang 和 ns 是 tomelo 规定的参数，ns 是用来设置命名空间的，默认为 translation。在本地服务中，您可以为每种语言地区和每个命名空间创建一个 JSON 文件。

添加文本

当您需要添加新的文本时，可以使用 add 方法：

tomelo.add('hello', {
  en: 'Hello',
  'zh-CN': '你好'
});

在上面的代码示例中，我们添加了一个名为 hello 的文本，并设置了英文和简体中文的翻译。

获取文本

当您需要使用添加的文本时，可以使用 t 方法：

const helloText = tomelo.t('hello');

console.log(helloText); // Hello

tomelo 会自动根据当前设置的语言来获取对应的翻译。

切换语言

您可以通过 setLang 方法来切换语言：

tomelo.setLang('zh-CN');

在上面的代码示例中，我们将语言切换为中文。

高级用法

命名空间

当您需要添加多种类型的文本时，可以使用命名空间来进行分类。例如，您可以为表单字段和错误消息分别创建不同的命名空间。

import Tomelo from 'tomelo';

const tomelo = new Tomelo({
  lang: 'en-US',
  ns: ['translations', 'forms', 'errors'],
  url: './locales/{{ lang }}/{{ ns }}.json'
});

在上面的代码示例中，我们为 tomelo 设置了三个命名空间：translations、forms 和 errors。

当您需要添加文本时，需要指定命名空间：

tomelo.add('forms.email', {
  en: 'Email',
  'zh-CN': '邮箱'
});

在上面的代码示例中，我们将命名空间设置为 forms，并添加了一个名为 email 的文本。

当您需要使用添加的文本时，需要指定命名空间：

const emailText = tomelo.t('forms.email');

console.log(emailText); // Email

变量

当您需要使用变量来实现更加动态的文本时，可以使用变量功能。例如，您可以创建一个欢迎消息，其中包含用户的名称：

tomelo.add('welcome', {
  en: 'Welcome, {{ name }}!',
  'zh-CN': '欢迎，{{ name }}！'
});

在上面的代码示例中，我们添加了一个名为 welcome 的文本，并使用了 {{ name }} 来表示变量。

当您需要使用添加的文本时，需要传入变量：

const welcomeText = tomelo.t('welcome', {
  name: 'John'
});

console.log(welcomeText); // Welcome, John!

在上面的代码示例中，我们传入了一个名为 name 的变量，并将其设置为 John。

总结

通过本教程，我们了解了 tomelo 的基本使用方法，并学习了如何使用命名空间和变量来实现更加强大的功能。通过 tomelo，我们可以轻松地管理应用程序中的多语言文件，使其更加易于维护和扩展。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cda81e8991b448e6859