Require.JS + JQuery插件+客户托管的JQuery冲突

Question

我们已经建立了一个类似于shopify的平台，在这个平台上我们为eCommerce托管客户网页。

在每个页面上，我们都有一些通过requireJS加载的平台javascript。

这个平台javascript使用jquery Cookie作为插件。

如果客户还安装了jQuery，则可能导致Cookie插件将自身安装到jQuery的customers实例中，而不是我们的jQuery实例中。

客户html：

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

app.js我们的代码

require.config({
    "paths": {
        "jquery": "bower_components/jquery/jquery.min",
        "jquery-cookie": "bower_components/jquery-cookie/jquery.cookie",
    },
    "shim": {
        "jquery-cookie": ["jquery"]
    }
});

platform.js我们的代码

define(['jquery', 'jquerye-cookie'], function(jQuery, jQueryCookie) {
    console.dir(jQuery.cookie); // <-- Not available, sometimes
});

您可以在console.dir上看到，有时jQuery.cookie将不可用，这是因为jQuery cookie会将自身安装到全局$中，这可能是客户的jQuery版本或我们的版本。

我唯一的解决办法就是一直使用我们的平台js的编译版本。在生产中，这很好，因为我们的代码是一起编译的，并且包括我们的jQuery依赖我们的代码执行顺序是确定的，并且在加载时，jQuery cookie安装到正确的jQuery对象中。

问题是在开发中，这是一个只能在我们的平台js的编译版本上工作的PITA。仅仅是编译时间就让我们慢了不少。

我正在讨论如何在我们的平台JS中移除所有的jQuery依赖。我不想那样做，因为我也会失去欧芹菜。有没有更好的解决方案来避免这个问题？

更新：

无冲突模式无法工作，因为jquery cookie (和其他jquery插件)的工作方式是：

(function ($, document, undefined) {
    $.cookie = function (key, value, options) {
    });
})(jQuery, document);

因此，正如你所看到的，即使我将我们的平台重命名为类似于“jQuery $”的名称，插件仍然会将其自身加载到window.jQuery中，这要么是未定义的，要么是客户的jQuery版本。

编辑：

需要明确的是，这不是“一个”客户，而是许多(最终希望是数千个)。

Answer 1

当我查看AMD插件的current code时，我看到它检测到它是否运行在jQuery风格的加载器(即RequireJS )中，并使用define。这意味着这个插件不需要填充程序。

现在，问题中的失败是如何发生的呢？

• A客户端也将RequireJS用于其代码。这意味着有两个配置被传递给RequireJS。它们可能会发生冲突。RequireJS不是为检测此类冲突而设计的。(只要得到的配置对RequireJS有意义，它就不会抱怨。)根据加载这两个配置的方式，结果可能是indeterminate.
• A客户端不使用RequireJS作为其代码。如果此客户端还在其自己的代码中包含jQuery cookie插件，则可能会产生问题，因为在加载其版本的插件时，不知道$的值是多少。

Answer 2

您是否允许客户将任何HTML内容添加到页面...？一般来说，出于安全原因，这不是一个好主意，再加上像这样的情况，一个完全无害的用户意外地破坏了你的网站。您可以尝试在无冲突模式http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/中运行jquery，但如果客户可以输入任何旧的javascript，他们总会有办法破坏您站点的javascript。因此，我认为真正的答案是限制客户可以输入的内容。