使用 r.js 和 `empty:` 时，require.js shim 选项不起作用答案

【问题标题】：require.js shim option does not work when using r.js and `empty:`使用 r.js 和 `empty:` 时，require.js shim 选项不起作用
【发布时间】：2015-06-30 15:39:11
【问题描述】：

我正在使用 jquery 1.11.3、require.js 2.1.18 和 r.js 2.1.18

我想将 jquery.js 放在外部以使用浏览器缓存。

//file js/main.js
require.config({
        baseUrl: 'js',
        paths: {
                'jquery': '//cdn.bootcss.com/jquery/1.11.3/jquery.js'
        },
        shim: {
                'p': ['jquery']
        }
});

require(['jquery', 'p'], function($) {
        alert(222);
});


//file js/p.js
//this is an jquery plugin which does not support AMD
alert($().jquery);


//file build.js
({
        baseUrl: "js",
        name: "main",
        out: "app.js",
        paths: {jquery: "empty:"}
})

会报错

`Uncaught ReferenceError: $ is not defined(anonymous function) @ app.js:1`

但是下面的代码可以工作，alert("1.1.13") 然后alert(222)

//file js/main.js
require.config({
        baseUrl: 'js',
        paths: {
                'jquery': 'jquery.js'
        },
        shim: {
                'p': ['jquery']
        }
});

require(['jquery', 'p'], function($) {
        alert(222);
});


//file js/p.js
alert($().jquery);


//file build.js
({
        baseUrl: "js",
        name: "main",
        out: "app.js",
        paths: {jquery: "jquery"}
})

第一段代码有什么问题？谢谢~

【问题讨论】：

标签： javascript jquery requirejs r.js

【解决方案1】：

RequireJS 不允许做你想做的事。 notes on shim 拼出来：

不要在构建中混合使用 CDN 加载和 shim 配置。 示例场景：您从 CDN 加载 jQuery，但使用 shim 配置加载依赖 jQuery 的 Backbone 的库存版本。进行构建时，请确保在构建文件中内联 jQuery，并且不要从 CDN 加载它。否则，Backbone 将内联在构建的文件中，并在加载 CDN 的 jQuery 加载之前执行。这是因为 shim 配置只是延迟加载文件，直到加载依赖项，但不执行任何自动包装定义。 在构建之后，依赖项已经内联，shim 配置不能延迟执行非定义（）的代码，直到以后。定义（）的模块在 CDN 加载代码之后可以工作build 因为它们正确地将源代码包装在定义工厂函数中，该函数在加载依赖项之前不会执行。所以教训：shim config 是非模块化代码、遗留代码的权宜之计。 define() 的模块更好。

（已添加重点。）

除非您将p 重写为正确的 AMD 模块，否则您必须放弃 CDN。

【讨论】：