简介
i18n-extractor 是一个用于提取 JavaScript 代码中的国际化文本的 npm 包。它可以自动扫描代码,并将代码中用到的文本提取出来生成一个翻译文件,方便后续的多语言翻译工作。
本文将详细介绍 i18n-extractor 的使用方法,并附带一个示例代码作为演示。
安装
首先,你需要在项目中安装 i18n-extractor:
--- ------- -------------- ----------
配置文件
i18n-extractor 支持使用配置文件来配置其行为。配置文件的默认文件名为 .i18nrc
,但你也可以通过命令行参数来指定其他的配置文件。
以下是一个示例配置文件 .i18nrc
:
- ---------- ------ ------ --------- ------------------------- -------- --------------------- --------------------------- --------- ------- ---------------- - ------------ ---------------------- ----------------- --------- --------------------- ---------------- --------- ---------------------- ---------------- -- -------------------- - ------------ ------- --------- ------- --------- ------ -- ------------- ------- ------- -
其中包含了以下配置项:
locales
: 一个字符串数组,列出了所有可用的语言代码。这些语言代码将被用于生成对应的翻译文件。output
: 翻译文件的输出路径,可以使用{locale}
占位符指定语言代码。input
: 待扫描的代码路径,支持 glob 格式。marker
: 标识用于打上待翻译文本的标记字符串,默认为i18n
。functionNames
: 一个对象,用于指定识别哪些函数作为文本提取器,以及这些函数在 JS 代码中的名称。对象的键名应该是函数类型(如"translate"
、"plural"
、"select"
等),键值应该是一个字符串数组,列出了所有可能的 JS 函数名称。jsxAttributeNames
: 一个对象,用于指定识别哪些 JSX 属性作为文本提取器,以及这些属性在 JSX 代码中的名称。对象的键名应该是函数类型(如"translate"
、"plural"
、"select"
等),键值应该是一个字符串数组,列出了所有可能的 JSX 属性名称。extensions
: 待扫描的文件扩展名,如".js"
、".jsx"
。
使用方法
在项目的根目录下运行以下命令来提取所有待翻译文本:
--- -------------- -------
此时,i18n-extractor 将会扫描指定的代码路径,并提取出其中的待翻译文本,然后将其保存到输出路径中的翻译文件中。
生成的翻译文件格式如下:
- ----- - ----------- ------- -------- ------- --- ---- -- --------- ------ --------- ------- ------- -- ----- ----- ----- ---------- -- ----- ----- ----- ---------- --- ----- ----- ------- -- ----- - ----------- --------- ------- --------------- ------ --------- ------- ----------------- ------------------- --------------------- - -
而源代码中的待翻译文本,则通过 marker
标记被注释掉:
-- ----- ------ ------ ------------------- --------- -- ----- -- ---- -- ------- --------------- ---- -- ----------- -- ----- -------- ------- ------- -- ----- ----- ----- ---------- -- ----- ----- ----- ---------- --- ----- ----- ------ -------------------------------- --- ------ --------------- --------- ------- ------- -- ----- ----- ----- ---------- -- ----- ----- ----- ---------- --- ----- ----- -------- -- - ------- --- ----
示例代码
以下是一个演示用的 React 代码,其中包含了多种可翻译的文本:
------ ----- ---- -------- ------ - ----------------- ---------------- --------------------- - ---- ------------- ----- -------- - - - --- ----------- --------------- ------- -------- -- - --- ------- --------------- --- ---- -- --------- -- -- ----- ----------- - -- ----- ------- --- -- -- - ------ - ----- ----------------- ------------- ---------------------- ------- -- ----------------- --------- ------------------ ---- -- -------- --------- ---- -- -- ---------------- -------- ----------- ------------------------ ------- ------- -- ----- ---- ----- ---------- -- ----- ---- ----- ---------- --- ----- ----- ------- ------------- ------- ------- -- ----- ---- ----- ---------- -- ----- ---- ----- ---------- --- ----- ----- ------- --------------- ------- ------- -- ----- ----- ----- ---------- -- ----- ----- ----- ---------- --- ----- ----- ------- ---------- ------ -- -- ---------------------- ---------------- -------------------- -- - ------------ ------------- --- ---- -- - ------------- ---------- --------- ------- --------- -- --------------------------- -- --------- -- ---------------- -- -- ----------------- ---------------- -------------------- -- - ---------- --------------- --- ---- -- - ------------- -------------- --------- ----- --------- -- ------- ----------------------------- -- --------- -- -- -------------------- -- -- ------- ----------- -- ------------- ---------- ----------------- ------------- ------------------- ------ -- --------- -- -------------- ----------------- -------------- ---------------------- -- ---- ------ -- -- ------ ------- ------------
运行 i18n-extractor,它会将所有可翻译的文本提取出来,生成一个翻译文件,其中包含了如下内容:
- ----- - ----------- ------- -------- ------- --- ---- -- --------- ------ --------- ------- ------- -- ----- ---- ----- ---------- -- ----- ---- ----- ---------- --- ----- ----- -------- -------------- ----- -- - ------------ ------------- --- ---- -- - ------------- ----------- ----------- ---- ------- ------------ ------- -- ----- - ----------- --------- ------- --------------- ------ --------- ------- ----------------- ------------------- ---------------------- -------------- ----- --------------------- --- --------------- ----------- ------ ------------ ------ - -
随着项目中可翻译文本的不断增多,i18n-extractor 能够帮助我们快速、准确地提取这些文本并交由翻译人员进行翻译。同时,它的配置参数也让我们能够更加灵活地进行提取,以应对不同的代码场景。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/77006