我正在使用 requirejs+jquery,我想知道是否有一种聪明的方法可以让 jQuery 插件与 require 一起工作。
例如,我正在使用 jQuery-cookie。如果我理解正确,我可以创建一个名为 jquery-cookie.js 的文件并在里面做
define(["jquery"], // Require jquery
function($){
// Put here the plugin code.
// No need to return anything as we are augmenting the jQuery object
});
requirejs.config( {
"shim": {
"jquery-cookie" : ["jquery"]
}
} );
我想知道我是否可以像 jQuery 那样做一些事情,就像这样:
if ( typeof define === "function" && define.amd && define.amd.jQuery ) {
define( "jquery", [], function () { return jQuery; } );
}
或者如果这是使 jQuery 插件与 requirejs 或任何 amd 兼容的唯一方法
最佳答案
在 RequireJS 中使用 shim 配置有一些注意事项,在 http://requirejs.org/docs/api.html#config-shim 上指出.即,当您使用优化器时,“不要在构建中混合 CDN 加载和 shim 配置”。
我一直在寻找一种方法,可以在使用和不使用 RequireJS 的网站上使用相同的 jQuery 插件代码。我在 https://github.com/umdjs/umd/blob/master/jqueryPlugin.js 找到了这个 jQuery 插件的片段.您将您的插件包装在这段代码中,无论哪种方式它都会正常工作。
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module depending on jQuery.
define(['jquery'], factory);
} else {
// No AMD. Register plugin with global jQuery object.
factory(jQuery);
}
}(function ($) {
$.fn.yourjQueryPlugin = function () {
// Put your plugin code here
};
}));
归功于 jrburke;就像很多 javascript 一样,它是作用于其他函数的函数内部函数。但我想我已经解开了它的作用。
第一行中的函数参数 factory
本身就是一个函数,它被调用以在 $
参数上定义插件。当不存在与 AMD 兼容的加载器时,将直接调用它以在全局 jQuery
对象上定义插件。这就像常见的插件定义习惯用法:
function($)
{
$.fn.yourjQueryPlugin = function() {
// Plugin code here
};
}(jQuery);
如果有模块加载器,则 factory
被注册为加载器在加载 jQuery 后调用的回调。 jQuery 的加载副本是参数。相当于
define(['jquery'], function($) {
$.fn.yourjQueryPlugin = function() {
// Plugin code here
};
})
关于javascript - 如何使用 requirejs 使 jQuery 插件可加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10918063/