通过 Browserify 在浏览器中使用 NodeJS 模块（1）

look_w

NodeJS 把 JavaScript 的使用从浏览器端扩展到了服务器端，使得前端开发人员可以用熟悉的语言编写服务器端代码。这一变化使得 NodeJS 很快就流行起来。在 NodeJS 社区中有非常多的高质量模块可以直接使用。根据最新的统计结果，NodeJS 的 npm 中的模块数量已经超过了 Java 的 Maven Central 和 Ruby 的 RubyGems，成为模块数量最多的社区。不过这些 NodeJS 模块并不能直接在浏览器端应用中使用，原因在于引用这些模块时需要使用 NodeJS 中的 require 方法，而该方法在浏览器端并不存在。Browserify 作为 NodeJS 模块与浏览器端应用之间的桥梁，让应用可以直接使用 NodeJS 中的模块，并可以把应用所依赖的模块打包成单个 JavaScript 文件。通过 Browserify 还可以在应用开发中使用与 NodeJS 相同的方式来进行模块化和管理模块依赖。如果应用的后台是基于 NodeJS 的，那么 Browserify 使得应用的前后端可以使用一致的模块管理方式。即便应用的后端不使用 NodeJS，Browserify 也可以帮助进行前端代码的复用和组织。
NodeJS 的模块管理在介绍 Browserify 之前，有必要首先介绍一下 NodeJS 中的模块管理机制。NodeJS 使用的是 CommonJS 中定义的模块机制。NodeJS 中的模块系统非常简单。模块与 JavaScript 文件之间是一一对应的关系。每个 JavaScript 文件都是一个模块。在 JavaScript 文件中通过 exports 来声明该模块对外提供的接口，包括属性和方法。除了 exports 中包含的内容，JavaScript 文件中的其他变量都是私有的。这样可以实现很好的模块封装。模块的使用者通过 require 方法来加载其他模块，并使用该模块所提供的公开接口。
代码清单 1 中给出了名为 greet.js 的 JavaS 文件的内容。该文件中的模块对外提供了一个 greet 方法。
清单 1. NodeJS 模块定义示例

1 2 3

exports.greet = function(name) { return "Hello, " + name; };

代码清单 2 中给出了如何使用该模块的示例。通过 require 方法来加载当前目录下的 greet.js 文件，并把模块提供的对象赋值给 greet 变量，再通过 greet.greet 调用模块提供的 greet 方法。
清单 2. NodeJS 模块的使用示例

1 2	var greet = require('./greet.js'); console.log(greet.greet('Alex'));

如果模块只提供一个方法，或者只需要通过一个赋值语句就可以提供一个完整的对象，可以直接赋值给 module.exports，如代码清单 3 所示。
清单 3. 使用 module.exports 声明模块

1 2 3

module.exports = function(name) { return "Hello, " + name; }

加载模块使用的是 require 方法。如果 require 方法参数中的模块名称以“/”开头，则认为模块名称表示的是绝对路径。如果模块名称以“./”开头，则认为模块名称是相对于 require 方法调用所在文件的当前目录的相对路径。比如 require(‘./app/greet’)会加载调用 require 方法的文件所在目录的子目录 app 下面的 greet.js 文件。
如果模块名称不以“/”、“./”或“../”开头，并且不是 NodeJS 自带的模块，则会在 node_modules 目录中查找。在 node_modules 目录中进行查找是一个递归的过程，首先从当前模块的父目录开始，一直递归查找，直到文件系统根目录。
除了单个文件之外，也可以把模块相关的文件组织到一个目录中。只需要在目录中创建一个 package.json 文件，并指定模块主文件即可，如代码清单 4 所示。
清单 4. 模块目录中的 package.json 文件示例

1 2 3 4

{ "name" : "greet", "main" : "./lib/greet.js" }

如果代码清单 4 中的 package.json 文件在 greet 目录中，当通过 require(“./greet”)来加载模块时，会加载 greet 目录下的 lib/greet.js 文件。如果要加载的模块目录下没有 package.json 文件，则会尝试加载默认的 index.js 文件。如果 index.js 文件不存在，则 require 方法会出错。