enb-js 是一个可以帮助前端开发者编写模块化 JavaScript 的 npm 包。在使用 enb-js 之后，你可以通过在 JavaScript 模块中使用“依赖声明”，并使用 enb-js 编译工具来自动化地完成模块的合并、优化、压缩等操作，从而达到降低文件请求次数，优化代码体积和性能的目的。
本文将为大家介绍 enb-js 的基本使用方法，并且提供实际的示例代码以帮助读者深入理解该 npm 包的实际应用。
安装 enb-js
使用 enb-js 需要在 Node.js 环境中安装 enb 工具和 enb-js 包。在安装之前确保您的电脑已经安装好了 Node.js。
- --- ------- --- -- - --- ------- ------ ----------
其中 $ npm install enb -g 的命令是全局安装 enb 工具，$ npm install enb-js --save-dev 命令是将 enb-js 安装为项目的 devDependencies。
配置 enb-js
新建文件夹 ./.enb，并在此文件夹下新建一个 enb-make.js 文件，此文件为 enb 命令会用到的配置入口文件。在 enb-make.js 中，我们需要配置一个构建流程，告诉 enb-js 包具体应该如何编译我们的 JavaScript 模块。
----- --- - ---------------
----- -- - -----------------------------------
--------------------- -
----
--------------- ------ --------------
------- --------------
--
---在此配置中，我们使用了 enb-js 提供的 browser-js 技术对 JavaScript 模块进行编译。在调用 js 方法时，我们提供了几个参数来详细指定我们的编译需求：
sourceSuffixes：指定原始的 JavaScript 模块代码文件后缀名，enb-js 会自动地将这些文件组合在一起，并按照依赖顺序进行编译。target：指定最终编译后合并后输出的 JavaScript 文件名。
模块依赖声明
在使用 enb-js 编写 JavaScript 模块时，我们可以通过依赖声明的方式来告诉 enb-js 在编译时需要依赖哪些其他的模块。依赖声明的方式如下：
--------------------------- ----------- ----------------- -- -
-- ---- ------ ----
---
--在上述代码中，我们通过 modules.define 方法来定义一个 JavaScript 模块。其中，第一个参数 'my-module' 为模块名，第二个参数 ['jquery'] 表示 my-module 模块依赖于 jQuery 模块。
最后的回调函数中，我们使用 provide 方法来告诉 enb-js 编译器此模块所提供的整个对象（也可以只提供其中的某个方法）。
在一个模块中使用依赖模块的方法与普通模块使用方法并无区别：
--------------------------- ----------- ----------------- -- -
--- --- - ---------- -
--------------------------------- -------
--
---------
---- ---
---
---
-------------------------------- -------------- ----------------- --------- -
---------------
---在上述代码中，我们声明了 another-module 模块依赖于 my-module，然后在 provide 回调函数中拿到了 my-module 对象，并调用了 myModule 中的 foo 方法，将全局 body 标签的背景色设置为红色。
构建 enb-js
在完成配置和编写 JavaScript 模块的依赖声明后，我们需要执行 enb 命令对 JavaScript 模块进行编译。执行如下命令，enb-js 会自动地在 src 目录中的每个 JS 文件夹下找到 JavaScript 模块，读取其依赖关系并进行编译：
- --- ----
编译成功后，我们的编译后 JavaScript 文件将被置于 desktop.bundles/index/ 文件夹下，文件名称如下：
index.browser.js：编译后的浏览器端 JavaScript 文件index.browser.min.js：压缩过的、体积更小的浏览器端 JavaScript 文件
结语
enb-js 是一个极为优秀的 npm 包，它为我们提供了一种规范化的 JavaScript 模块编写方式，并在编译过程中自动化地完成模块合并、优化和压缩，能够极大地帮助我们提升前端应用的加载速度与性能体验。
学习和使用 enb-js 不仅具有深入的指导意义，还能为我们的前端开发工作带来很大帮助。希望本文能够为读者提供丰富和实用的 enb-js 使用案例和实际代码。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/71836