带有 requireJS 的工具提示系绳

Question

Bootstrap 的最新测试版 (v4) 使用 Tether js 定位元素，我无法让它在我的 Requirejs 应用程序中工作。

在我的 requirejs 配置中，我有以下垫片

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

当我想在我的应用中激活工具提示时，我使用以下我认为正确的代码

function page_events() {
    requirejs(['bootstrap'], function(bootstrap) {
        $('[data-toggle="tooltip"]').tooltip(); 
    }); 
}

这应该首先加载引导程序依赖项，然后执行代码。所以通常 Tether 应该包含在这段代码之前。

但是控制台结果是

Uncaught ReferenceError: Tether is not defined

有人有同样的问题吗？

Answer 1

创建一个这样的脚本：

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

然后改变这个：

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

为什么？因为浏览器需要这个：

window.Tether = tether; // May be both requirejs and tether didn't do this

Answer 2

如果您希望 Tether 在全球范围内可用，您应该使用脚本标签手动包含它。 RequireJS 不会暴露它。

<script type="text/javascript" src="/js/tether.js"></script>
<script type="text/javascript" src="/js/optimized.min.js"></script>