Зачем загружать jquery дважды

Question

На моей странице html мне нужно поставить jquery дважды. Если я возьму кого-нибудь из них на моей странице, страница не будет отображаться. Пожалуйста, обратите внимание, что оба включенных «jquery» указывают на одно и то же местоположение.

Я использую backbone.js. Я добавил require.js для включения jquery в нижней части страницы. Кроме того, мне нужно добавить jquery в начале страницы. Как только я добавлю эти два, тогда вся моя страница будет отображаться правильно. Если я возьму любой из них, я начну получать проблемы.

Может кто-нибудь рассказать о том, почему эта проблема происходит.

Script добавлен в 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 включен в верхней части следующей страницы это ошибка, которую я получаю:

Если я беру JQuery из требует модуля в нижней части, то ниже будет ошибка:

PS: Я использую chart.js внешний файл нарисовать график и материал на страница.

Answer 1

Обычным решением этой проблемы было бы использовать 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

Избавление от одного включать не будет работать, потому что:

1. Вы должны Jquery быть загружены до Bootstrap (первый <script> тега)
2. модуля вы также загружены с помощью RequireJS не может непосредственно использовать JQuery, который загружается через <script src="jQuery.min.js"> тег (нижний тег)

Answer 2

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 
});