在前端开发中，多语言是一个常见需求。broccoli-ember-i18n-precompile 是一个能够处理 Ember 应用的本地化文件的 npm 包，可以很好地解决国际化的问题。
本篇文章将为大家介绍如何使用 broccoli-ember-i18n-precompile，详细讲述其使用和配置方法，同时提供示例代码以供参考。
什么是 broccoli-ember-i18n-precompile？
broccoli-ember-i18n-precompile 是一个对直接源码进行翻译的 Ember I18N 前置处理器。通过该工具，我们可以通过配置 files 和 input 字段来将所有的 I18n.t 告知翻译结果，并在编译之前为所有的翻译结果生成一个 JavaScript 对象。这个对象可以是直接放在 <head> 中，也可以在载入 Ember 时异步载入。
如何安装 broccoli-ember-i18n-precompile？
安装 broccoli-ember-i18n-precompile 很简单，只需要在命令行中输入如下命令即可：
--- ------- ------------------------------ ----------
如何配置 broccoli-ember-i18n-precompile？
broccoli-ember-i18n-precompile 工具配置简单，只需要在 Brocfile.js 文件中进行配置即可。首先，需要使用 broccoli-ember-i18n-precompile 的 precompile 方法生成 JavaScript 对象，然后通过 broccoli-concat 在编译时将代码打包成一个 JS 文件。
示例代码如下：
--- ------------- - ----------------------------------------------------- --- ------ - --------------------------- --- --------- - -------------------------- --------- - ----------------- - ----------- ------------ ----------- ----------------- ---
例如以上代码，i18nFiles 会生成一个 JavaScript 对象，用于在 Ember 事件中调用翻译文本。inputFiles 设置为读取 app/i18n 下所有的 .js 文件作为输入，outputFile 则设置为生成的文件名和文件路径，输出在 assets/i18n.js。
如何在代码中使用 broccoli-ember-i18n-precompile？
下面为大家演示如何在代码中调用 broccoli-ember-i18n-precompile 生成的 JavaScript 对象。
添加翻译文件
在 Ember 的代码中，所有的本地化字符串都在一个 key-value 对象中存储，例如：
------ ----- ---- -------- ------ ------------ ---- -------------------------- ------ ------- ------------------------- -------- ------------------------ ---
在 app/i18n 目录下，我们可以添加翻译文件，例如 zh-CN.js，里面存储了中文本地化字符串的 key-value 对象：
------ ------- - ----------- --------- -
在代码中调用
在代码中调用之前，我们需要在在.html 文件的头部加入 i18n.js 文件：
--------- -----
------
------
------- ------------------------------
----- ----------------
--------------------
-------
------
---
-------
-------在代码中调用时，只需要用 I18n.t('some.key') 就可以获取翻译结果了。
------ ----- ---- -------- ------ ------------ ---- -------------------------- ------ ------- ------------------------- -------- ------------------ ---
总结
本文介绍了如何使用 broccoli-ember-i18n-precompile，详情请参阅官方文档。通过使用这个工具，我们可以在 Ember 应用中通过配置 files 和 input 字段将所有的 I18n.t 告知翻译结果，并在编译之前为所有的翻译结果生成一个 JavaScript 对象。自此，我们在开发过程中就可以很方便地处理多语言问题了。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066c8bccdc64669dde5312