4

我正在使用 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 路径。这似乎每次都设置得很好。但这不会破坏 shim 的目的吗?不喜欢我必须设置路径并设置它的依赖项的事实。

任何帮助,将不胜感激。它快把我逼疯了。:)

我错过了什么吗?还是我需要在 jquery 插件之前使用 $plugins 路径为 shim 键添加前缀?

可能的解决方案

我找到了解决方案……我相信;我仍在测试以确认跨浏览器。

请注意 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...
});
4

1 回答 1

0

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

您需要在 require config 中设置,如下所示enforceDefinetrue

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

这种强制要求undef()模型出错,并等待模型正确定义后再继续。在这里阅读

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

shim: {
    "jquery": {
        exports: "jQuery"
    },
    "jquery-ui": {
        deps: ['jquery'],
        exports: "jQuery.ui"
    }
}
于 2012-08-27T15:00:50.290 回答