Question

我对r.js有一些问题我希望有人可以解释一下。

考虑以下垫片：

shim: {
    plugin: ['jquery'],
    plugin2: ['jquery', 'plugin']
}

以下任意插件（注意：它们不需要是jQuery插件，但2必须依赖于1）。

插件1：

(function ($) {
    $.test = function () {
        console.log('from plugin 1');
    }
})(jQuery);

插件2：

(function ($) {
    $.test();
})(jQuery);

r.js将构建以下内容：

(function ($) {
    $.test = function () {
        console.log('from plugin 1');
    }
})(jQuery);
define("plugin", function(){});

(function ($) {
    $.test();
})(jQuery);
define("plugin2", function(){});

哪个好 - 一切都按照正确的顺序。

但是，如果我需要设置

wrapShim: true

在构建配置中，我将其作为输出：

(function(root) {
    define("plugin", [], function() {
        return (function() {
            (function ($) {
                $.test = function () {
                    console.log('from plugin 1');
                }
            })(jQuery);
        }).apply(root, arguments);
    });
}(this));

(function(root) {
    define("plugin2", [], function() {
        return (function() {
            (function ($) {
                $.test();
            })(jQuery);
        }).apply(root, arguments);
    });
}(this));

我不确定我是否误读了将wrapShim设置为true的观点，但不应该将其编译为：

define("plugin", ["jquery"], function() ...

和

define("plugin2", ["jquery", "plugin"], function() ...

看来wrapShim完全忽略了垫片中设置的依赖关系。

Answer 1

这是一个错误，修复此处的修复： https://github.com/jrburke/r.js/issues/813

Answer 2

在撰写本文时进一步检查时，似乎依赖关系以较长的形式列出：

shim: {
    plugin: {
        deps: ['jquery']
    },
    plugin2: {
        deps: ['jquery', 'plugin']
    }
}

然后正确地注入依赖项。

麻烦需要js shims和r.js

2 个答案: