问题描述:

latest beta version (v4) of Bootstrap uses Tether js to position elements, I am unable to let it work in my Requirejs app.

in my requirejs config I have the following shim's

paths: {

jquery: '/path/to/jquery',

tether: '/path/to/tether'

},

shim: {

'bootstrap': ['tether', 'jquery']

}

And when I want to activate tooltips in my app, I use the following code which I think is correct

function page_events() {

requirejs(['bootstrap'], function(bootstrap) {

$('[data-toggle="tooltip"]').tooltip();

});

}

This should load bootstraps dependencies first and afterwards execute the code. So normally Tether should be included before this piece of code.

But the console result is

Uncaught ReferenceError: Tether is not defined

Does anyone have the same issue?

网友答案:

Create a script like this:

define(['lib/tether.min'], function(tether) {
    window.Tether = tether;
    return tether;
});

Then change this:

paths: {
    jquery: '/path/to/jquery',
    // tether: '/path/to/tether'
    tether: '/path/to/your-own-tether'
},
shim: { 
     'bootstrap': ['tether', 'jquery']       
}

Why? because the browser need this:

window.Tether = tether; // May be both requirejs and tether didn't do this
网友答案:

if you want Tether to be available globally you should include it manually with a script tag. RequireJS doesn't expose it.

<script type="text/javascript" src="/js/tether.js"></script>
<script type="text/javascript" src="/js/optimized.min.js"></script>
相关阅读:
Top