我看到的关键点:
- 与 RequireJS 一起使用时,jQuery 将自己注册为名为“jquery”的模块(全部小写)。在您的示例中,您试图将其用作“jQuery”,这有点混淆,因为这也是它在加载时注册的全局函数的名称(参见第 2 点)。
- 默认情况下,jQuery 使用全局函数“$”和“jQuery”注册自己,即使与 AMD/RequireJS 一起使用也是如此。如果要关闭此行为,则必须调用 noConflict 函数。
您可以在 noConflict 调用中包装 RequireJS 对 jQuery 的引用,如下例所示。据我所知,当您没有其他需要全局 $ 或 jQuery 的模块时,这是推荐的方法:
requirejs.config({
paths: {
'jquery': 'vendor/jquery',
}
});
define('jquery-private', ['jquery'], function (jq) {
return jq.noConflict( true );
});
require(['jquery-private'], function(jq) {
console.log(jq); // working
console.log($); // undefined
console.log(jQuery); // undefined
});
另请参阅我在此问题中关于如何映射其他模块以使用私有(无冲突)版本的回答。
有关更多背景信息,请参阅 jQuery 源代码中的这些行,它们是我上面描述的所有内容的原因:
// Expose jQuery to the global object
window.jQuery = window.$ = jQuery;
// Expose jQuery as an AMD module, but only for AMD loaders that
// understand the issues with loading multiple versions of jQuery
// in a page that all might call define(). The loader will indicate
// they have special allowances for multiple jQuery versions by
// specifying define.amd.jQuery = true. Register as a named module,
// since jQuery can be concatenated with other files that may use define,
// but not use a proper concatenation script that understands anonymous
// AMD modules. A named AMD is safest and most robust way to register.
// Lowercase jquery is used because AMD module names are derived from
// file names, and jQuery is normally delivered in a lowercase file name.
// Do this after creating the global so that if an AMD module wants to call
// noConflict to hide this version of jQuery, it will work.
if ( typeof define === "function" && define.amd && define.amd.jQuery ) {
define( "jquery", [], function () { return jQuery; } );
}
更新: RequireJS 站点的使用 jQuery 部分已更新以反映上述信息。另请参阅此答案以了解包括优化器的分步操作。只是想再次强调,这种 noConflict 方法仅在您的所有插件都兼容 AMD 时才有效。