使用 jQuery 作为没有 data-main 属性的模块引导 RequireJS 应用程序答案

【问题标题】：Bootstrapping RequireJS app with jQuery as a module without data-main attribute使用 jQuery 作为没有 data-main 属性的模块引导 RequireJS 应用程序
【发布时间】：2012-02-17 15:26:05
【问题描述】：

在使用的应用程序中，我没有办法在 requirejs 的标签上指定属性。我可以以

的形式指定脚本标签

<script type="text/javascript" src="scripts/require.js"></script>

我可以在这个标签之前或之后附加另一个标签，并包含引导我的应用程序（主模块）的代码。我正在使用 jQuery 1.7.1 并希望将其作为依赖项加载到其他模块中。我也想在没有 requirejs-jquery 包的情况下做到这一点，所以 jQuery 与 requirejs 分开。我正在寻找正确的方法来做到这一点。我对 requirejs 还很陌生，所以对如何加载模块和代码示例的解释会很棒。谢谢！

【问题讨论】：

你阅读过关于 require.js 文档的 jquery 教程吗？很有帮助 - requirejs.org/docs/jquery.html
我有。那里的示例确实使用了 data-main 属性，这就是我有点迷失的地方。我希望有人找到了正确的方法来执行这种“替代配置”并愿意在这里分享。

标签： jquery requirejs javascript

【解决方案1】：

在 requirejs 之后包含另一个 javascript 文件。

<script type="text/javascript" src="scripts/require.js"></script>
<script type="text/javascript" src="scripts/main.js"></script>

在这个文件中你必须配置 requirejs 以便它找到 jquery。

main.js

require.config({
    paths: {
        "jquery": "js/jquery-1.7.1.min"//edit this path so it suits your needs.
  } 
});

从现在开始，您将能够通过

将 jquery 加载到您的模块中

require(['jquery'], function ($) {
    $('#foo').show();
});

【讨论】：

你能解释一下最后一个要求属于哪里吗？是在 main.js 还是其他模块中？如果是后者，你如何告诉它在 main.js 中加载它？
requirejs 加载完成后，你可以在任何你想使用的地方使用require()。这可以是 main.js 或您加载的任何其他 js。
谢谢！我最终将 main.js 重命名为 requirejs-config.js，最后调用了 require(["main"]) 。这样 requirejs-config.js 配置路径并告诉 requirejs 首先加载哪个文件。然后主文件没有引导/配置逻辑。
这确实打开了错误的可能性 - main.js 依赖于 require.js，有时您可能会发现 main.js 在 require.js 之前加载，这会导致定义未定义错误。
加载脚本是同步的。如果你不给加载 requirejs 的脚本元素添加 async 属性，它就会在那里。