Using Twitter Bootstrap with requireJS - undefined is not a function`

Question

After doing some reading of the following question I wrapped my compiled bootstrap JS plugin file in an AMD module like so:

define(['zepto'], function($){ ...Bootstrap pasted here... });

Then this is what my main.js file looks like for config:

require.config({
    baseUrl: 'js',
    paths: {
        'zepto': 'lib/zepto',
        'underscore': 'lib/underscore',
        'backbone': 'lib/backbone',
        'text': 'lib/text',
        'bootstrap': 'lib/bootstrap'
    },
    shim: {
        'zepto': {
            exports: '$'
        },
        'underscore': {
            exports: '_'
        },
        'backbone': {
            deps: ['zepto', 'underscore'],
            exports: 'Backbone'
        }
    }
});
require([
    'app',
    'zepto',
    'underscore',
    'backbone',
    'bootstrap'
    ],
    function(App){
        //start the app
        App.initialize();
});

But in the console i am getting the following error in the bootstrap.js file:

Uncaught TypeError: undefined is not a function 

It seems $ is not defined even though it is being passed into the module. The full wrapped bootstrap module is available here.

Am using zepto which is supposed to be compatible with Bootstrap and am exporting $ from the shim so cannot see why this is not working for me.

Answer 1

I fixed this by adding the following lines of code in the bootstrap JS file.

Where window.jQuery is passed into the functions modified this to include the Zepto global object also like so window.jQuery || window.Zepto

More information here:

Zepto with Bootstrap