如何使用 browserify-shim 正确填充 jquery / Backbone

Question

我正在尝试构建一个使用主干/jquery 的独立 JS 库。这是一个sample repo，它代表我正在尝试构建的库。

我对这个库有几个目标：

1. 不要暴露任何全局变量（即正确包装所有内容，以免泄漏）
2. 不受任何其他打包工具（如 requireJS）的影响
   • 这个库可以加载到任何其他网站，我不希望与 可能存在的 JS 发生任何冲突（这是我无法控制的），例如 requireJS

所以，我的理解是我可以使用 browserify-shim 正确地填充这些模块，以便它们可以按预期在 browserify 中与 require 一起使用。我很确定 shim 在包装这些模块时应该取消定义 defines 和 require，这将实现目标 #2。目标 #1 有望通过按预期使用 browserify 来实现。

我似乎真的无法让它工作，我不确定这是否只是我对 browserify-shim 的误解。无论我是否从命令行运行 browserify，我似乎都有同样的问题：@987654326 @ 或使用 gulp 构建。

基本上，就好像browserify-shim 甚至没有运行。如果你打开 index.html，你可以看到我加载的 requirejs 代码肯定会影响我的 lib，因为 Backbone 只是一个空对象，然后 requirejs 崩溃。

你可以在repo中看到我的package.json here，大致是这样的：

{
...
"browserify-shim": {
    "./node_modules/jquery/dist/jquery.js": "$",
    "./node_modules/underscore.js": "_",
    "./node_modules/backbone.js": {
      "exports": "Backbone",
      "depends": [
        "./node_modules/underscore.js",
        "./node_modules/jquery/dist/jquery.js"
      ]
    }
  },
  "devDependencies": {
    "browserify": "^4.1.11",
    "browserify-shim": "^3.6.0",
    "gulp": "^3.8.1",
    "vinyl-source-stream": "^0.1.1"
  },
  "dependencies": {
    "backbone": "^1.1.2",
    "jquery": "^1.11.0",
    "underscore": "^1.6.0"
  }
}

不确定我在这里缺少什么，但我没有运气。我想知道是否有人可以提供帮助或至少证实我正在努力实现的目标是正确的，并且可以通过browserify-shim 实现。

谢谢。

编辑

为了说明它绝对不是填充模块，我创建了一个完全相同的build/main.js 和一个build/main-shimmed.js。我运行的 main.js 没有 shim 配置，而 shimed 有上述配置。我显然在这里遗漏了一些东西。

Answer 1

Browserify 和 Browserify-shim 在这种情况下工作，你的 main.js 正在调用正确的 require。

您遇到的问题是您捆绑的库也试图连接 AMD 样式配置。你的“过河”，当心戈泽尔。

要么获取没有 AMD 配置加载器的版本，要么将它们注释掉。