使用RequireJS 2.0.1和shim加载jQuery，Underscore和Backbone

Question

我正在尝试使用RequireJS 2.0.1 。 我的目标是正确加载jQuery，Underscore和Backbone。 从最初的RequireJS文档中我发现作者J. Burke（在这个新版本中）添加了一个名为shim的新配置选项。

然后我在这里写下这些东西：

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>Testing time</title>
        <script data-main="scripts/main" src="scripts/require.js"></script>
    </head>
    <body>
        <h1>Testing time</h1>
    </body>
</html>

scripts/main.js

requirejs.config({
    shim: {
        'libs/jquery': {
            exports: '$'
        },
        'libs/underscore': {
            exports: '_'
        },
        'libs/backbone': {
            deps: ['libs/underscore', 'libs/jquery'],
            exports: 'Backbone'
        }
    }
});


define(
    ['libs/jquery', 'libs/underscore', 'libs/backbone'],

    function (jQueryLocal, underscoreLocal, backboneLocal) {
        console.log('local', jQueryLocal);
        console.log('local', underscoreLocal);
        console.log('local', backboneLocal);
        console.log('global', $);
        console.log('global', _);
        console.log('global', Backbone);
    }
);

一切似乎工作得很好，但我觉得我缺少一些东西，我知道有jed和Underscore的AMD版本，但如果设置如此简单，我不明白为什么我应该使用它们。

那么，这个设置是正确的还是我错过了什么？

Answer 1

如果库尚未调用define()来声明模块，则只需使用“shim”配置。 jQuery已经这样做了，所以你可以从shim配置中删除它。 上面的代码将按原样运行，但jQuery的export shim config将被忽略，因为jQuery将在shim工作完成之前调用define() 。

垫片与脚本调用define()来定义模块的缺点：

它的可移植性/可靠性较低：每个开发人员都需要进行填充配置，并跟踪库的变化。 如果图书馆作者在图书馆中内嵌，那么每个人都可以更有效地获得收益。 umdjs / umd的代码模板可以帮助改变代码。
不太理想的代码加载：shim config通过在加载实际库之前加载shim deps来工作。 所以它比并行更顺序加载。 如果可以并行加载所有脚本，则速度更快，这在使用define()时是可能的。 如果您为最终部署进行构建/优化并将所有脚本合并到一个脚本中，那么这不是一个真正的缺点。

Answer 2

你正在做的是正确的，但jQuery不需要在shim配置中，因为它导出AMD （异步模块定义）模块。 Underscore在添加后迅速删除了对AMD / Require.js的支持，请参阅：为什么underscore.js删除了对AMD的支持

Shim旨在方便使用不导出AMD模块的库。 如果您使用的库确实支持AMD，或者有2个版本（一个支持AMD，一个是全局变量），则应使用AMD版本。 您应该使用AMD版本的原因与您首先使用AMD的原因相同，也因为库可能在其源代码中包含require.js（或Almond ），并且会为您的项目添加不必要的文件大小。

Answer 3

您是否真的可以避免在原始示例中将jquery“填充”（jquery的路径设置为'libs / jquery'），因为jquery在其amd模块定义中添加了名称“jquery”？

define（“ jquery ”，[]，function（）{return jQuery;}）;

我的经验是你需要将jquery.js放在baseurl目录中以获得按预期定义的jquery amd模块，或者像原始示例中那样“填充”它。

使用RequireJS 2.0.1和shim加载jQuery，Underscore和Backbone

问题描述

3 个解决方案

解决方案1
32 已采纳 2012-06-03 22:54:41

解决方案2
8 2012-06-03 23:18:12

解决方案3
0 2012-09-02 00:03:23

使用RequireJS 2.0.1和shim加载jQuery，Underscore和Backbone

问题描述

3 个解决方案

解决方案1 32 已采纳 2012-06-03 22:54:41

解决方案2 8 2012-06-03 23:18:12

解决方案3 0 2012-09-02 00:03:23

解决方案1
32 已采纳 2012-06-03 22:54:41

解决方案2
8 2012-06-03 23:18:12

解决方案3
0 2012-09-02 00:03:23