npm 包 alchemy-i18n 使用教程

在国际化多语言开发中，我们需要针对不同语言提供不同的翻译内容。此时，我们可以使用 alchemy-i18n 这个 npm 包来管理多语言文本。

什么是 alchemy-i18n？

alchemy-i18n 是一个可以在 Node.js 和浏览器中使用的多语言包。它支持标记替换和如下几种语言风格：

• Plain text，即纯文本
• Namespace，即命名空间
• Dot notation，即点符号

如何使用 alchemy-i18n？

可以使用 npm 包管理工具来安装 alchemy-i18n：

npm install alchemy-i18n --save

安装成功后，我们可以在项目中引入 alchemy-i18n：

const i18n = require('alchemy-i18n');

翻译内容的定义

在使用 alchemy-i18n 之前，我们需要定义多语言文本的内容。定义文本可以放在一个 json 文件中，根据语言的不同，我们需要创建不同的 json 文件。

创建一个名为 locales/en.json 的文件，用于英语语言的翻译内容：

{
    "helloWorld": "Hello, World!",
    "menu": {
        "home": "Home Page",
        "about": "About Us"
    }
}

在这个 json 文件中，我们定义了两个翻译文本，一个是 Plain text 的 "Hello, World!"，另一个是 Namespace 的 "menu.home" 和 "menu.about"。

多语言文本的读取

在项目中，我们可以通过 i18n.load() 函数来读取翻译文本:

i18n.load({
    locales: ['en', 'zh-CN'],
    directory: path.join(__dirname, '/locales')
});

在这个示例中，我们加载了 locales 目录下的英语（en）和简体中文（zh-CN）两种语言翻译内容，可以根据实际需要修改。

多语言文本的使用

使用 alchemy-i18n，我们可以在代码中通过 i18n.t() 函数来调用相应的翻译内容：

i18n.t('helloWorld');
// "Hello, World!"

i18n.t('menu.home');
// "Home Page"

以上示例中，我们分别调用了英语的 "helloWorld" 和 "menu.home" 翻译内容。

在实际项目中，我们需要根据用户的语言设置来加载相应的翻译内容。我们可以使用 i18n.setLocale() 函数来设置语言：

i18n.setLocale('en');
// 设置语言为英语

i18n.t('menu.about');
// "About Us"

在这个示例中，我们设置了语言为英语，并调用了 "menu.about" 的翻译内容。

参数替换

在翻译文本中，我们可以使用 %s 或者 %{variable} 来指代参数。使用时，我们需要为 i18n.t() 函数传递替换的参数。

使用 %s

{
    "greeting": "Hello, %s!"
}

i18n.t('greeting', 'Peter');
// "Hello, Peter!"

在这个示例中，我们将一个参数 %s 带入到翻译文本中，并在调用 i18n.t() 函数时传入替换值。

使用 %{variableName}

{
    "greeting": "Hello, %{name}!"
}

i18n.t('greeting', {name: 'Peter'});
// "Hello, Peter!"

局限行

在 alchemy-i18n 的实现中，如果你使用 . 符号来指定嵌套对象，那么你只能用 . 符号调用，不能使用 [] 符号。如果您更喜欢使用[]符号，那么可以考虑其他npm包，例如react-i18next。

总结

通过 alchemy-i18n ，我们可以轻松管理多语言文本翻译，使得我们可以针对不同语言提供不同的翻译内容。此外，通过参数替换，我们可以在翻译文本中引入变量，使得我们的翻译内容更加灵活。

使用 alchemy-i18n 的过程中，我们需要注意的是：使用 . 符号指定对象时，不能使用 [] 符号调用，另外如果要使用参数替换需要注意使用 %s 或者 %{variable} 的方式。

示例代码

-- -------------------- ---- -------
----- ---- - ------------------------
----- ---- - ----------------

-----------
    -------- ------ ---------
    ---------- -------------------- -----------
---

---------------------

----------------------------------
-- ------- -------

---------------------------------
-- ----- -----

------------------------------ ----------
-- ------- -------

------------------------------ ------ -----------
-- ------- -------

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