javascript - 将 Browserify 与 JavaScript 库(例如 Backbone 或 Underscore)一起使用？

Question

我知道我可以使用 npm 安装下划线，但这不是我在工作环境中可以做的事情。我需要能够下载 Underscore.js 库，然后使其“浏览器兼容”。

所以我们假设 Underscore.js 看起来像这样:

(function() {
    var root = this;

    // Rest of the code

}.call(this));

我将该文件下载到硬盘上并将其另存为 under.js。

我的需要下划线的文件如下所示:

var underscore = require("./under");
console.log(underscore);

然后我从 cli 运行 browserify。

我有一个名为 test.html 的 HTML 页面，基本上它所做的就是加载生成的 bundle.js。

但是，console.log(underscore) 行失败 - 表示 underscore 是未定义。

我尝试了什么？

显然，我将 module.exports 添加到第一行 - 就在 under.js 中的函数定义之前，这就是我收到上述错误的原因。我也尝试了this answer中的方法，仍然遇到同样的错误。

那么，在不使用 npm 安装的模块的情况下，如何使用 Browserify 加载 Underscore.js 或 Backbone 等库？

Answer 1

这是因为 browserify 不会将变量添加到全局范围。您下载的版本与您通过 NPM 安装的版本相同。

您需要将其显式附加到窗 Eloquent 能将其导出到顶级范围。

如果您创建一个名为“expose_underscore.js”的文件并将其放入其中:

var _ = require('./under');
window._ = _;

会做，然后是:browserify expose_underscore.js > bundle.js然后添加bundle.js作为<script>标记您将能够在控制台中执行以下操作:

但是，如果您使用 browserify，则不应执行此操作。它(以及 Node 的 commonJS 版本)背后的要点是，您在需要它的任何地方都明确需要它。因此，您拥有的每个需要下划线的文件都应该将其导入到局部变量中。

别担心——您仍然只会加载一份副本。