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

编辑 如@ Paul-Sebastian所述，最好将tether从出现在Bootstrap的deps中删除，以消除重复包含的可能性.基本上，这是更新的代码:"tether",{ "name": "bootstrap", "path": "../node_modules/bootstrap/dist", "main": "js/bootstrap.min", "deps": ["jquery"], "exports": "$", "resources": [ "css/bootstrap.css" ] }, 编辑#2 现在在Aurelia-CLI中刚刚添加了一个append部分，以帮助使用带有插件的旧版库.该部分内容如下: 一个带有插件的非常顽固的旧版库 某些旧版库可能支持您还希望将其包含在捆绑软件中的插件.在某些情况下，这些插件取决于 主库定义的全局对象，因此重要的是 插件在捆绑包中的存在时间比主库脚本晚.这些 插件可以进入append部分，其工作原理完全相同 作为prepend部分，但脚本会附加到 捆绑销售商品，其他所有商品除外.像前置部分一样，所有项目 是相对于项目文件夹，而不是src.I am trying to add Bootstrap 4 to Aurelia. I can only get the CSS to work but the bootstrap.js requires Tether and I can't get it included, since I keep getting this error in the console:Bootstrap tooltips require TetherI tried something along this"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" ]},It does bundle, but it's still complaining about the missing Tether. I read on another stack answer that I have to makeTetheravailable globally which could be done viarequirejs.config.js` with thisdefine(['lib/tether.min'], function(tether) { window.Tether = tether; });but there's no such config with Aurelia. 解决方案 After some more time spent on this, I believe that I came up with something working. I don't see anymore errors and I am now able to use Bootstrap tooltip, so I will assume this is the working solution.All the changes were made inside the aurelia.json configuration file, as the following:"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" ] }, ...So basically, I just had to add it to the prepend to get it working. Also note that adding tether inside the deps[] array has no effect (probably because Tether is now global with the prepend), but I like to see it there as a reminder that it's a dependencies anyway.EDITAs mentioned by @Paul-Sebastian, it's probably better to remove tether from showing up in the deps of Bootstrap to remove possibility of double inclusion. Basically this is the updated code:"tether",{ "name": "bootstrap", "path": "../node_modules/bootstrap/dist", "main": "js/bootstrap.min", "deps": ["jquery"], "exports": "$", "resources": [ "css/bootstrap.css" ] },EDIT #2There is now also an append section that just got added to Aurelia-CLI to help with Legacy Library with Plugins. The section reads as the following: A Very Stubborn Legacy Library With Plugins Some legacy libraries may support plugins which you also want included in your bundle. In some cases these plugins depend on a global object defined by the main library, so it is important that the plugins exist later in the bundle than the main library scripts. These plugins can go in the append section, which works exactly the same as the prepend section but the scripts are appended to the end of the bundle, after all other items. Like the prepend section all items are relative to the project folder, not the src. 这篇关于如何在Aurelia-CLI中添加系绳以与Bootstrap 4一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！