Question

希望这是一个相当简单的答案。我正在尝试将AMD版本的Twitter的Bootstrap插件加载到我的require模块中，该模块使用的是无冲突版本的jquery（我需要无冲突版本，因为我在一些遗留代码中有另一个jquery对象）。

但是，我无法让AMD插件在我定义的require模块中为我的无冲突jquery对象添加方法。任何人都知道我在那里做错了什么？似乎应该是显而易见的。

AMD bootstrap模块来自这里： https://github.com/clexit/bootstrap-amd

这是我的代码。

require.config({
    map: {

      '*': { 'jquery': 'jquery-private' },
      'jquery-private': { 'jquery': 'jquery' }
    },    
    paths : {
        jquery : '../bower_components/jquery/jquery',
        underscore : '../bower_components/underscore/underscore',
        backbone : '../bower_components/backbone-amd/backbone',
        marionette : '../bower_components/marionette/lib/core/amd/backbone.marionette',
                    'backbone.wreqr' : '../bower_components/backbone.wreqr/lib/amd/backbone.wreqr',
                    'backbone.babysitter' : '../bower_components/backbone.babysitter/lib/amd/backbone.babysitter',
                    'localstorage' : '../bower_components/backbone.localStorage/backbone.localStorage',
        handlebars : '../bower_components/handlebars/handlebars',
        text: '../bower_components/requirejs-text/text',
        hb: '../bower_components/requirejs-handlebars/hb',
        bootstrap: '../bower_components/bootstrap/amd'
    },
    shim : {
        underscore : {
            exports : '_'
        },
        handlebars: {
            exports: 'Handlebars'
        }
    }
});

require(['jquery', 'bootstrap'],function($){
    console.log($);
    $('#MainRegion').modal();
});

Answer 1

我在github上有一个存储库，demonstrates如何操作。

在这个演示中，我像这样加载jQuery 1.8.3：

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

然后我有RequireJS加载jQuery 1.10.2：

  require.config({
      baseUrl: "./js",
      paths: {
          jquery: 'jquery-1.10.2'
      },
      packages: [
          { name: "bootstrap", location: "../bootstrap/amd" }
      ],
      map: {
          '*': { 'jquery': 'jquery-private' },
          'jquery-private': { 'jquery': 'jquery' }
      },
  });

我注意到在你的配置中你没有使用packages选项，这会导致RequireJS加载bootstrap失败。 map条件是您在其他问题中解释的内容，并记录在案here。

然后我可以用这段代码测试它：

  console.log("Non-AMD version of jQuery", $.fn.jquery, $.fn.modal);
  require(["jquery", "bootstrap"], function ($) {
      console.log("AMD version of jQuery", $.fn.jquery, $.fn.modal);
      $(".modal").modal();
  });

演示中的index.html文件包含模式显示所需的脚手架。模态确实显示出来，证明Bootstrap安装在由RequireJS加载的jQuery版本上。

修改requirejs no-conflict jquery对象

1 个答案: