如何在Bootstrap和Dojo中使用jQuery noConflict

Question

我編寫了一個小部件，該部件使用最新版本的jQuery，Bootstrap和Dojo for AMD。 問題在於它將被嵌入到具有舊版jQuery的頁面中。 （客戶端頁面，我無法控制）

我正在嘗試使用jQuery的noConflict選項，但是在嘗試加載Bootstrap時無法使其正常工作。

簡單的noConflict可以工作：

require(["jquery"], function (jQueryForPlugin) {

  // create local scope var and resets the global $ and jQuery 
  // to their previous values, so we don't mess up client's page
  var jQuery = jQueryForPlugin.noConflict(true);
  var $ = jQuery;

  // Now I can use $ like normal, and it will use my widget's jQuery version.
  $('.some-class').hide();

問題出在其他庫中，尤其是Twitter Bootstrap，當我加載它們時，它們看不到新的作用域jQuery變量。

引導程序看不到本地noConflict $和jQuery： JSF

require(["jquery"], function (jQueryForPlugin) {
  // Resets the global $ and jQuery to their previous values.
  var jQuery = jQueryForPlugin.noConflict(true);
  var $ = jQuery;

  require([ 'bootstrap'], function ( bootstrap) {
    // ERR: Bootstrap load throws error because it can't find 'jQuery' in its scope.

Answer 1

Vanilla Bootstrap不兼容AMD。 您必須稍微編輯Bootstrap的JS才能自己添加AMD模塊樣板，以便它可以使用require() jQuery。

另請參見https://github.com/twbs/bootstrap/pull/12909

[ 編輯 ：Bootstrap v3.2.0應該與AMD兼容！ 參見https://github.com/twbs/bootstrap/pull/13772 ]