为Browserify定义全局变量

Question

我正在使用SpineJS（它导出一个commonjs模块）并且它需要全局可用，因为我在任何地方都使用它，但似乎我必须对每个使用Spine的文件执行Spine = require('spine')要做的事情。

有没有办法定义Spine一次以使其全局可用？

PS：我以Spine为例，但我总体上想知道如何与其他任何库一起使用。

Answer 1

在每个文件中编写Spine = require('spine')是正确的方法。

然而，使用global或window对象有多种可能性（browserify将global对象设置为window，这是全局命名空间：

spine.js中的
• ：global.Spine = module.exports
• 在browserify捆绑的任何其他.js文件中：global.Spine = require('spine')
• 在.html文件引用的脚本标记或.js文件中，位于spine.js文件之后：window.Spine = require('spine')

Answer 2

首先，对于你的例子，大卫是正确的。在你需要的每个模块中包含所有依赖项。它非常详细，但没有编译时间魔法可以缓解各种反模式和潜在的未来问题。

真正的答案。

这并不总是实用的。 Browserify接受名为insertGlobalVars的选项。在构建时，扫描每个流式文件以查找与提供的密钥名称匹配的标识符，并将模块包装在包含解析模块中未分配的每个标识符的参数的IIFE中。这一切都发生在依赖树最终确定之前，这允许您使用require来解析依赖关系。

TLDR

在Browserify中使用insertGlobalVars选项。

browserify({
  insertGlobalVars: {
    spine: function(file, dir) {
      return 'require("spine")';
    }
  }
});

对于扫描的每个文件，如果存在未分配的标识符spine，请解析为require("spine")。