如何在Aurelia-CLI中添加Tether以与Bootstrap 4一起使用

Question

我想补充引导4到Aurelia.我只能得到CSS工作,但bootstrap.js需求Tether,我不能把它包括在内,因为我在控制台中不断收到此错误:

Bootstrap tooltips require Tether

我尝试过这个

"jquery",
"Tether",
{
  "name": "tether",
  "path": "../node_modules/tether/dist",
  "main": "js/tether.min",
  "exports": "Tether",
  "resources": [
    "css/tether.css"
  ]
},
{
  "name": "bootstrap",
  "path": "../node_modules/bootstrap/dist",
  "main": "js/bootstrap.min",
  "deps": ["tether", "jquery"],
  "exports": "$",
  "resources": [
    "css/bootstrap.css"
  ]
},

它确实捆绑了,但它仍在抱怨失踪Tether.我读了另一个堆栈的答案 ,我必须available globally which could be done via用这个makeTether requirejs.config.js`

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

但是没有这样的配置Aurelia.

Answer 1

经过一段时间花在这上面之后,我相信我想出了一些有用的东西.我没有看到任何错误,我现在可以使用Bootstrap tooltip,所以我认为这是有效的解决方案.

所有更改都在aurelia.json配置文件中进行,如下所示:

"prepend": [
   "node_modules/bluebird/js/browser/bluebird.core.js",
   "node_modules/tether/dist/js/tether.min.js",
   "scripts/require.js"
],
"dependencies": [
    ...
    "aurelia-templating-binding",
    "jquery",
    "tether",
    {
        "name": "bootstrap",
        "path": "../node_modules/bootstrap/dist",
        "main": "js/bootstrap.min",
        "deps": ["jquery", "tether"],
        "exports": "$",
        "resources": [
            "css/bootstrap.css"
        ]
    },
    ...

所以基本上,我只需要将它添加到它以prepend使其工作.另请注意,tether在deps[]数组内部添加没有任何效果(可能因为Tether现在是全局的prepend),但我喜欢在那里看到它作为提醒,它仍然是依赖项.

编辑

正如@Paul-Sebastian所提到的那样,最好不要tether出现deps,Bootstrap以消除双重包含的可能性.基本上这是更新的代码:

"tether",
{
    "name": "bootstrap",
    "path": "../node_modules/bootstrap/dist",
    "main": "js/bootstrap.min",
    "deps": ["jquery"],
    "exports": "$",
    "resources": [
        "css/bootstrap.css"
    ]
 },

编辑#2

现在还有一个append部分刚刚被添加Aurelia-CLI到帮助Legacy Library with Plugins.该部分内容如下:

一个非常顽固的遗产图书馆与插件

某些旧版库可能支持您希望包含在捆绑包中的插件.在某些情况下,这些插件依赖于主库定义的全局对象,因此插件后面的插件比主库脚本更重要.这些插件可以放在append部分中,该部分与部分完全相同,prepend但脚本将附加到捆绑的末尾,在所有其他项目之后.与前置部分一样,所有项目都与项目文件夹相关,而不是src.