無法通過RequireJS加載Bootstrap

Question

我似乎無法弄清楚如何通過RequireJS加載Bootstrap。沒有發現我找到的例子。

這裏是我的墊片：

require.config({ 
    // Sets the js folder as the base directory for all future relative paths 
    baseUrl: "./js", 
    urlArgs: "bust=" + (new Date()).getTime(), 
    waitSeconds: 200, 
    // 3rd party script alias names (Easier to type "jquery" than "libss/jquery, etc") 
    // probably a good idea to keep version numbers in the file names for updates checking 
    paths: { 

     // Core libsraries 
     // -------------- 
     "jquery": "libs/jquery", 
     "underscore": "libs/lodash", 
     "backbone": "libs/backbone", 
     "marionette": "libs/backbone.marionette", 

     // Plugins 
     // ------- 
     "bootstrap": "libs/plugins/bootstrap", 
     "text": "libs/plugins/text", 
     "responsiveSlides": "libs/plugins/responsiveslides.min", 
     'googlemaps': 'https://maps.googleapis.com/maps/api/js?key=AIzaSyDdqRFLz6trV6FkyjTuEm2k-Q2-MjZOByM&sensor=false', 


     // Application Folders 
     // ------------------- 
     "collections": "app/collections", 
     "models": "app/models", 
     "routers": "app/routers", 
     "templates": "app/templates", 
     "views": "app/views", 
     "layouts": "app/layouts", 
     "configs": "app/config" 

    }, 

    // Sets the configuration for your third party scripts that are not AMD compatible 
    shim: { 

     "responsiveSlides": ["jquery"], 
     "bootstrap": ["jquery"], 
     "backbone": { 

     // Depends on underscore/lodash and jQuery 
     "deps": ["underscore", "jquery"], 

     // Exports the global window.Backbone object 
     "exports": "Backbone" 

     }, 
     "marionette": { 
     // Depends on underscore/lodash and jQuery 
     "deps": ["backbone", "underscore", "jquery"], 
     // Exports the global window.Backbone object 
     "exports": "Marionette" 
     }, 
     'googlemaps': { 'exports': 'GoogleMaps' }, 
     // Backbone.validateAll plugin that depends on Backbone 
     "backbone.validate": ["backbone"] 

    }, 
    enforceDefine: true 

}); 

，這裏是我如何調用引導：

define([ 
     "jquery", 
     "underscore", 
     "backbone", 
     "marionette", 

     "collections/Navigations", 
     'bootstrap', 
     ], 
function($, _, Backbone, Marionette, Navigations, Bootstrap){ 

，我得到的錯誤是這樣的：

Uncaught Error: No define call for bootstrap 

如何任何想法解決這個問題？

Answer 1

我找到了工作示例這裏：

https://github.com/sudo-cm/requirejs-bootstrap-demo

我跟着它讓我的代碼工作。

Answer 2

Bootstrap lib不會返回任何對象，如jQuery，Underscore或Backbone：此腳本只是通過添加新方法來修改jQuery對象。所以，如果你想使用的引導庫，你只需要在模塊中添加和使用jQuery的方法，像往常一樣（不declarating引導像PARAM，因爲該值undefined）：

define([ 
    "jquery", 
    "underscore", 
    "backbone", 
    "marionette", 
    "collections/Navigations", 
    "bootstrap", 
    ], 

function($,_,Backbone,Marionette,Navigations){ 
    $("#blabla").modal("show"); //Show a modal using Bootstrap, for instance 
}); 

Answer 3

我發現這是足以以下內容添加到我的requirejs.config調用（僞）：

requirejs.config({ 
    ... 
    shim: { 
    'bootstrap': { 
     deps: ['jquery'] 
    } 
    } 
}); 

Answer 4

我喜歡用Require.Js ORDER插件，它做什麼？簡單地裝載所有的圖書館，以便在這種情況下，你不會得到任何錯誤，喔和引導取決於jQuery的，所以我們需要使用墊片在這種情況下：

requirejs.config({ 
    baseUrl: "./assets", 
    paths: { 
     order: '//requirejs.org/docs/release/1.0.5/minified/order', 
     jquery: 'http://code.jquery.com/jquery-2.1.0.min', 
     bootstrap: '//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min' 
    }, 
    shim: { 
     'bootstrap': { 
      deps:['jquery'] 
     } 
    } 
}); 

require(['order!jquery', 'order!bootstrap'], function($) { 

});