Не удается загрузить Bootstrap с RequireJS

Question

Я не могу понять, как загрузить Bootstrap через RequireJS. Ни один из примеров, которые я нашел, не работал для меня.

Вот моя прокладка:

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 

}); 

и вот как я называю Bootstrap:

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, Подчеркивание или Магистраль: этот скрипт просто модифицирует объект jQuery с добавлением новых методов. Итак, если вы хотите использовать библиотеку Bootstrap, вы просто должны добавить в модулях и использовать метод JQuery, как обычно (без declarating Bootstrap как пары, так как значение 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($) { 

});