为AMD、CommonJS等打包js库

Packaging a js library for AMD, CommonJS and more

本文关键字:js AMD CommonJS      更新时间:2024-01-21

在打包需要与AMD、CommonJS一起使用或作为全局使用的javascript库时,通常使用以下定义:

(function(name, definition) {
    if (typeof module != 'undefined') module.exports = definition();
    else if (typeof define == 'function' && typeof define.amd == 'object') define(definition);
    else this[name] = definition();
}('mod', function() {
    //Here goes the code you would normally have inside define() or add to module.exports
    return MyModule
    };
}));

假设您的库仅由一个文件组成,并且没有外部依赖项,则此操作效果良好。当发布一个由各种相互依赖的模块组成的库时,我不知道该怎么办,这些模块可能具有外部依赖关系。

即使我只想支持AMD(AMD+Bower是我的主要用例,即我自己使用库的方式),我也不确定该走哪条路。假设我的库发布模块foobar,其中bar依赖于foo,两者都有external作为依赖项。我可以试着做一些类似的事情

// mylib/foo.js
define(['external'], function(external) {
  // whatever
});
// mylib/bar.js
define(['./foo', 'external'], function(foo, external) {
  // whatever
});

尽管如此,我不能保证我的客户会正确解决"外部"问题。为此,客户端需要在其RequireJS定义中显式添加external的路径。如果只有一个依赖项,这仍然是可行的,但我更愿意保护客户端不必知道库使用外部。这应该在我的bower.jsonpackage.json文件中声明,但客户端不应该手动处理可传递的依赖关系。一旦一个库有多个依赖项,每个依赖项都有其他依赖项,事情就会变得一团糟。

处理库中依赖关系的正确方法是什么,尤其是考虑到支持多个模块标准的可能性?

我会使用r.js将模块合并到一个文件中(当然,只有内部依赖项)。

我不确定我是否正确理解了你的问题,但几个模块合并到一个文件中可以解决你的问题。

你专注于这个问题,RequireJS文档已经发布了一个例子:http://requirejs.org/docs/node.html

edit:看看jquery.js的尾部-他们处理了这样一种方法:https://gist.github.com/er1z/7721573