jquery - 使用 ShimConfig 的 Requirejs 2.0 和带有插件的 jQuery 是否需要路径？

Question

我正在使用 requirejs 2.x 并从 CDN 加载 jQuery 并在本地文件中进行备份。我正在尝试使用 shim 配置解决方案加载 jQuery 插件。这似乎在快速连接和本地浏览器上工作得很好，但是当我通过无线或慢速连接进行测试时，我似乎会遇到随机错误，插件正在寻找 jquery 但它尚未加载。尽管我已经浏览过与此问题相关的文档和其他网站，但设置看起来不错。

下面是一个示例。

// main.js    
requirejs.config({
   baseUrl: "scripts",
   paths: {
      "jquery" : [
         "//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min",
         "libs/jquery/jquery-1.8.0.min"
      ],
      "$plugins":"./libs/jquery",
      "modules" : "./app/modules",
   },
   shim: {
      "jquery.easing" : ["jquery"],
      "jquery.urlutils": ["jquery"]
   },
   priority: ["jquery"]
});

// somemodule.js
define([
   'modules/otherModule',
   'jquery',
   '$plugins/jquery.urlutils'
], function( OtherModule, $ ) {
   // code...
});

在这里我们可以看到“somemodule”正在加载 jQuery 和 otherModule(工作正常)。另一方面，jquery 有时仅在插件之前加载。我尝试使用直接路径将插件添加到路径对象，然后在上面的“somemodule”中省略 $plugins 路径。这似乎每次都设置得很好。但这是否违背了垫片的目的？不喜欢我必须设置路径并设置其依赖项的事实。

如有任何帮助，我们将不胜感激。这让我发疯。 :)

我错过了什么吗？或者我是否需要在 jquery 插件之前为 shim 键添加 $plugins 路径前缀？

可能的解决方案

我已经找到了解决方案...我相信；我仍在测试以确认跨浏览器。

注意 shim 中 jquery 插件 (jquery.urlutils) 的路径以及“somemodule”中定义的依赖项列表。另请注意，我使用路径来定向到插件的实际位置。

另请注意，我最终没有使用“enforeDefine”，如果这样做，我会再次收到错误和/或“定义不存在”错误。

requirejs.config({
   baseUrl: "scripts",
   paths: {
      "jquery" : [
         "//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min",
         "libs/jquery/jquery-1.8.0.min"
      ],
      "$plugins":"./libs/jquery",
      "modules" : "./app/modules",
   },
   shim: {
      "$plugins/jquery.easing" : ["jquery"],
      "$plugins/jquery.urlutils": ["jquery"]
   },
   priority: ["jquery"]
});

// somemodule.js
define([
   'modules/otherModule',
   'jquery',
   '$plugins/jquery.urlutils'
], function(OtherModule, $ ) {
   // code...
});

Answer 1

我现在正在阅读整个 RequireJS 2.0 文档，并且发现了我认为可以解决您的问题的内容。

您需要在 require config 中将 enforceDefine 设置为 true，如下所示:

requirejs.config({
    //To get timely, correct error triggers in IE, force a define/shim exports check.
    enforceDefine: true,
})

这会强制要求在错误时 undef() 模型，并等待模型正确定义后再继续。了解它 here

进一步阅读文档后，您似乎还必须将 exports 值设置为所包含脚本的返回值，以便 require 有一个变量可以检查负载是否已加载成功了。将 jquery 和 jquery-ui 添加到您的垫片中。

shim: {
    "jquery": {
        exports: "jQuery"
    },
    "jquery-ui": {
        deps: ['jquery'],
        exports: "jQuery.ui"
    }
}