控制 UMD javascript 模块的“公开的全局变量”答案

【问题标题】：Controlling "exposed global variable" of UMD javascript module控制 UMD javascript 模块的“公开的全局变量”
【发布时间】：2016-05-13 16:11:10
【问题描述】：

我正在创建一个小的 Javascript 前端框架。我决定针对 HTTP 2 优化它 -> 不捆绑。

我有异步依赖加载器，它按需（在浏览器中）加载给定页面所需的所有资源。

但是有一个小问题。假设应用程序程序员想要使用 jQuery。我将带有 jQuery 的脚本标签附加到正文中。

据我了解，托管在 cdn 上的所有库都使用 UMD。由于我既不使用 AMD、Common JS 也不使用 ES6 导入，它会将 jQuery 变量暴露给我的应用程序全局范围。

但我不想用该变量污染全局应用程序范围。相反，我希望能够重命名该变量，并可能将其添加到给定的命名空间。

有可能吗？

我正在考虑的一个解决方案是使用 XHR 请求加载该脚本，在其上使用 eval() 并以某种方式将结果包装在我的框架代码中。但我有点迷茫，不知道该怎么做。

感谢您的建议。

【问题讨论】：

标签： javascript module umd

【解决方案1】：

我们可以通过 XHR 包含脚本来实现这一点。

var myObj = {};
var myOverride = function(res){
  var jqRes = res.currentTarget.responseText;
  console.log(res.type);
  eval(jqRes);
  myObj.jq = $;
  $ = undefined;
  console.log(myObj.jq);
}
var xhr =  new XMLHttpRequest();
xhr.open("GET","https://code.jquery.com/jquery-2.2.3.js");
xhr.addEventListener("load",myOverride);
xhr.send();

请查找随附的 JSFiddle。 https://jsfiddle.net/h9aycg6m/

但我的建议是不要覆盖这些变量，因为 $ / jQuery 是术语已经在全球范围内。

【讨论】：