javascript - 如何正确使用 RequireJS 及其配置

Question

我在 RequireJS 方面遇到了很多麻烦，仅使用 define 模块就会出现错误。

假设我有这样的配置:

require.config({
    baseUrl: "js/",
    paths: {
        jquery: "libs/jquery/jquery-2.0.2.min",
        handlebars: "libs/backbone/template/handlebars",
        lodash: "libs/backbone/template/lodash.min",
        backbone: "libs/backbone/backbone-1.0.0.min",
        helper:"app/helper",
        jquery_cookie:"libs/jquery/plugin/jquery.cookie",
        text:"libs/require/text-2.0.7"
    },
    shim: {
        "lodash": {
            exports: '_'
        },
        "handlebars": {
            deps:["jquery"],
            exports: 'Handlebars'
        },
        "backbone": {
            deps: ["helper", "lodash", "handlebars", "jquery"],
            exports: "Backbone"
        }
    },
    urlArgs: "bust=" + (new Date()).getTime()
});


define(["jquery"], function ($) {
    console.log('define "jquery" on config.js');
    return $;
});
console.log("end config.js");

首先，我尝试了经典的方法，我加载了一个 config 文件，其中包含 JavaScript 文件的所有依赖项，我使用 jQuery、Backbone 和其他库。

<script type="text/javascript" data-main="config" src="js/libs/require/require-2.1.6.min.js"></script>
<script type="text/javascript">
    require(["jquery"], function ($) {
        console.log("jquery loaded");
    });
</script>

通过此配置，我得到这些错误和日志序列:

Uncaught Error: Mismatched anonymous define() module: function (){return r}
 > http://requirejs.org/docs/errors.html#mismatch 
end config.js
define "jquery" on config.js

似乎错误是指函数require.config(...);

我认为这是一个加载问题，所以我尝试使用 var require 如 RequireJS site 中所述。没有解决它。

荒谬的是，我正在开发一个在 Backbone 中构建的全屏应用程序，具有相同的配置，没有遇到任何问题，在这里我需要更多地使用不同的 View ，但我无法开始，基本上全部区别在于我使用的是 CakePHP。

为什么这不起作用，我哪里错了？

Answer 1

您使用的 jQuery 版本已经支持 AMD。所以你不必使用垫片。您可以直接给出路径并开始使用它。

由于该模块已在 jQuery 库中定义，因此当您尝试重新定义它时，它会抛出错误。以下代码尝试定义一个匿名模块。

define(["jquery"], function ($) {
     console.log('define "jquery" on config.js');
     return $;
});

删除上面的代码应该可以正常工作。以下代码使用require方法加载jquery模块。

require(["jquery"], function ($) {
     console.log($(document));
});

希望这能起作用。