require.js 使用 r.js 和 `empty:` 时填充选项不起作用

Question

我正在使用 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"}
})

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

Answer 1

RequireJS 不允许执行您正在尝试执行的操作。 notes on shim 拼出来：

Do not mix CDN loading with shim config in a build. Example scenario: you load jQuery from the CDN but use the shim config to load something like the stock version of Backbone that depends on jQuery. When you do the build, be sure to inline jQuery in the built file and do not load it from the CDN. Otherwise, Backbone will be inlined in the built file and it will execute before the CDN-loaded jQuery will load. This is because the shim config just delays loading of the files until dependencies are loaded, but does not do any auto-wrapping of define. After a build, the dependencies are already inlined, the shim config cannot delay execution of the non-define()'d code until later. define()'d modules do work with CDN loaded code after a build because they properly wrap their source in define factory function that will not execute until dependencies are loaded. So the lesson: shim config is a stop-gap measure for non-modular code, legacy code. define()'d modules are better.

（强调已添加。）

除非你重写p成为合适的AMD模块，否则你必须放弃CDN。

require.js 使用 r.js 和 `empty:` 时填充选项不起作用

require.js shim option does not work when using r.js and `empty:`

javascript

jquery

requirejs

r.js