(我应该事先澄清一下:我的问题是关于Javascript中的闭包和客户端模块模式。它不是关于如何使用jQuery.noConflict()。)
我有一些人们可以添加到他们网站的Javascript。我希望我自己的代码可以访问$变量,该变量解析为特定版本的jQuery,它独立于页面加载的任何内容。如果我的所有代码都在一个文件中,在我定义的闭包内,这很容易。但我正在努力寻找一种干净的方法来使用模块模式来实现这一点,其中我的代码是在单独的闭包中。
背景(即明显的问题不是问题)
当我的所有代码都在一个文件中时,这很容易。我可以在我最外层的闭包中创建一个$ var并使用$ .noConflict(...)来确保外部页面保留了自己的jQuery版本。像这样:
// This is easy and works as you'd expect
(function() {
var $; // The $ var in my local scope that the rest of my code can use.
function loadMyVersionOfjQuery() {
insertTheAppropriateScriptTagAndWaitForTheScriptToLoad(function() {
// Set the $ in my local scope and restore the global jQuery.
$ = jQuery.noConflict(true);
}
}
loadMyVersionOfjQuery();
... etc. ...
})();
现在我正在使用browserify将代码分解为单独的文件,这已经不再那么容易了。最麻烦的是我的jQuery版本是异步加载的。所以当我的模块require()正在处理时,我的jQuery版本还没有准备好。这使我无法在模块闭包的顶层创建和分配$ var。
我正在研究的一些想法
有没有人有任何想法?如何在多个文件中开发客户端Javascript模块,但仍然可以一起关闭所有代码?
答案 0 :(得分:1)
可能是我是唯一一个遇到过这种情况的人(Browserify +我希望在我的所有模块中使用的异步加载库),但我会分享我的解决方法#39;我想出来以防万一...
我最终定义了一个异步加载jQuery的模块,然后在听众准备就绪时通知他们。它基本上是对异步'的简单支持。我想要使用jQuery的所有模块最终都会得到一些像这样的样板代码:
var $; require('./jquery-provider').onLoad(function(jQuery) { $=jQuery; });
它并不完美,但很简单。它的工作原理是因为我的图书馆的切入点启动了我的jQuery提供商'并在调用我所有其他模块之前等待准备回调。因此,尽管我的模块都得到了Browserify的强制执行,因为它解决了所有的依赖关系,但我的模块中的所有函数都没有运行,直到我所需的库可用并传递给它们。
(如果此模式对其他人有用,我可以共享更多代码。)
答案 1 :(得分:0)
在我的app.js中我有这个
var $ = require('jquery')(window); global.jQuery = require("jquery");
然后使用从npm“plugin”下载并导入de模块并执行,就像这样。
var plugin = require('plugin');
plugin();
并且工作正常。