为什么我需要加载jquery两次

Question

在我的html页面中，我需要输入两次jquery。如果我将他们中的任何一个从我的页面中删除，那么该页面就不会呈现。请注意，包含的两个 "jquery" 都指向相同的位置。

我正在使用 backbone.js。我在页面底部添加了 require.js 以包含 jquery。另外，我需要在页面的开头添加 jquery 。一旦我添加了这两个，我的整个页面就会正确呈现。如果我把它们中的任何一个拿出来，我就会开始遇到问题。

谁能解释一下为什么会出现这个问题。

在页面的 HEAD 标签中添加脚本：

 <script src="../vendors/jquery/dist/jquery.min.js"></script>

在BODY底部添加脚本：

<script type="text/javascript">
require(['common'],function()
{
  require(['jquery', 'fastclick','nprogress','charts','underscore'],function()
  {
    require(['firstDashboardController']);
  });
});
</script>

如果我使用下面页面顶部包含的 jquery 是我得到的错误：

如果我从底部的 require 模块中取出 jquery，那么下面是错误：

P.S：我正在使用 chart.js 外部文件在页面上绘制图形和内容。

Answer 1

jQuery 使用全局函数“$”和 "jQuery" 注册自己，即使与 RequireJS 一起使用时也是如此。如果你想关闭这个行为你必须调用 noConflict 函数，你可能需要

define('jquery-require', ['jquery'], function (jq) {
  return jq.noConflict(true);
});

require(['jquery-require'], function(jq) {
  console.log(jq);      // working
  console.log($);       // undefined
  console.log(jQuery);  // undefined
});

Answer 2

这个问题的一个常见解决方案是使用 jQuery 的内置 $.noConflict(true) 但我建议您在底部 <script> 标记代码中使用以下内容完全防止 jQuery 的双重加载：

requirejs.config({
    paths: {
      jquery: '../vendors/jquery/dist/jquery.min.js'
    }
  });

  if (typeof jQuery === 'function') {
    //jQuery already loaded, just use that
    define('jquery', function() { return jQuery; });
  }

  require(["jquery"], function($) {
   //This $ should be from the first jquery tag, and no
   //double load.
  });

来源：https://github.com/requirejs/requirejs/issues/535

删除一个包含行不通，因为：

您需要 jQuery 在 Bootstrap 之前加载（第一个 <script> 标签）
你也使用 RequireJS 加载的模块不能直接使用 jQuery，它是通过 <script src="jQuery.min.js"> 标签（底部标签）

为什么我需要加载jquery两次

Why do I need to load jquery twice

javascript

jquery

requirejs

backbone.js

underscore.js