没有iframe的骨干沙箱

Question

我写了一个小的ES6脚本并使用webpack（UMD目标）与babel一起编写。我希望将Backbone（和Underscore）捆绑到脚本中，这样用户也不必导入它。

// src/index.js
import Backbone from 'backbone';
(function(){
    return Backbone.VERSION;
})

不幸的是，当编译的脚本导入HTML文件时，Backbone也会导入到全局范围内。例如，当将脚本导入到使用不同版本BB的页面时，这可能会导致各种问题。

<script src="/script.min.js"></script>
<script>
    console.log(Backbone.VERSION); // Backbone is defined :(
</script>

我知道解决方案是在iframe中执行脚本。有没有其他方法可以有效地完全隔离这个BB脚本？

Answer 1

这种行为是因为this line in backbone.js因此有两种选择，

• 执行something like this以阻止Webpack处理Backbone中的AMD定义，这将使其回退到不会设置全局的CommonJS。

• 使用.noConflict()清除意外的全局，例如

  import Backbone from "backbone";
  Backbone.noConflict();