@lingui/core 是一个前端国际化工具包，可以帮助开发人员将应用程序本地化，使其适应多语言环境。本文将介绍如何使用 @lingui/core 这个 npm 包来实现前端国际化。
安装
使用 npm 命令来在项目中安装 @lingui/core：
npm install @lingui/core --save
初始化
在项目的入口处初始化 @lingui/core：
-- -------------------- ---- ------- ------ - --------- - ---- --------------- ----- -------- - - --- --------------------------------- --- -------------------------------- -- ----- ---- - ----------- --------- --------- ------- ---- --- ------ ------- -----
上述代码中，我们使用了 setupI18n 方法来初始化 @lingui/core。
其中的 catalogs 对象中包含了所有需要使用的翻译条目。每个条目都是一个 JavaScript 对象，其键名为翻译条目的 ID，而键值则为翻译条目的文本内容。
引入翻译条目
在项目中需要使用到翻译条目的地方，可以这样做：
import i18n from "./i18n";
i18n._("Hello World!");上述代码中，我们使用了 _ 方法来获取对应的翻译文本。在第一个参数中传入翻译条目的 ID，即可获取该条目的翻译文本。
变量替换
在某些情况下，需要在翻译文本中使用变量，例如：
i18n._("Total: {total}", { total: 10 })上述代码中，我们在翻译文本中使用了变量 {total}，并在第二个参数中传入了变量的值。
复数形式
在某些情况下，翻译文本需要根据数量的不同自动切换为复数形式。
i18n._(
"{count, plural, =0 {You have zero messages.} one {You have one message.} other {You have {count} messages.}}"
{ count: 5 }
);上述代码中，我们使用了 plural 关键字来处理复数形式，其中的 =0 表示当变量 count 的值为 0 时，显示对应的翻译文本，one 则表示当变量 count 的值为 1 时，other 则表示当变量 count 的值为其他数值时。
总结
通过本文的介绍，我们学习了如何使用 @lingui/core 这个 npm 包来实现前端国际化。除了上述的示例代码，该工具包还提供了其他一些高级功能，可以帮助你更好地进行国际化开发。
希望本文能够对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedaa32b5cbfe1ea06103ac