我试图将Salvattore（CSS中的砌体替代品）集成到我的Aurelia应用程序中，但是不幸的是，它不起作用。在尝试了许多事情之后，我感到失望，并认为Salvattore根本不可能在Aurelia应用程序中工作。
这是我做的事情：感谢CLI au new，我创建了一个新的Aurelia项目，并且在此项目中，我在Aurelia项目中使用以下代码创建了一个html页面：
<div id="grid" data-columns>
<div>Item #1</div>
<div>Item #2</div>
<div>Item #3</div>
<div>Item #4</div>
</div>
有了这个CSS：
#grid[data-columns]::before {
content: '3 .column.size-1of3';
}
/* These are the classes that are going to be applied: */
.column { float: left; }
.size-1of3 { width: 33.333%; }
最初，我只是尝试在index.html页面（在close body标签上方）内引用Salvattore的js代码，如下所示：
<!DOCTYPE html>
<html>
<head>
<title>Aurelia</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, height=device-height />
</head>
<body aurelia-app="main">
<script src="scripts/vendor-bundle.js" data-main="aurelia-bootstrapper"></script>
<script src="javascript/salvattore.min.js"></script>
</body>
</html>
它不起作用，控制台出现错误。
我还尝试通过npm install salvattore --save安装Salvattore，并将其添加到aurelia.json中。在
main.ts中，我尝试引用它：import 'salvattore';但这都不起作用。我的意思是，这次没有错误，但是什么也没发生。最后，由于scriptinjector组件，我最后尝试将Salvattore js脚本直接插入到页面内部。再一次，它不起作用，什么也没发生。我是否必须得出一个结论，那就是Salvattore与任何Aurelia项目都不兼容？在这种情况下，您知道其他选择吗？
在基本html页面（不是Aurelia）中使用Salvattore的示例codepen下面
https://codepen.io/mitour/pen/wWMOvw
最佳答案
您必须了解cli捆绑器是AMD捆绑器。您的<script src="javascript/salvattore.min.js"></script>低于vendor-bundle，因此当浏览器读取salvattore.min.js时，AMD加载器（requirejs / systemjs）已经就位。这就是为什么salvattore尝试将自身加载为AMD模块而不是创建全局变量。
您可以将salvattore.min.js移到vendor-bundle脚本标签上方。
或者在aurelia.json中使用prepend，在prepend列表中的requirejs之前添加salvattore。
您可以尝试的另一件事是将其用作模块。不要在html中添加脚本标签，也不要在脚本标签前添加脚本标签。但是，请将此行添加到您的main.js或main.ts中。
import "salvattore"; // this will load it as an AMD module
关于javascript - 将Salvattore集成到我的Aurelia应用程序中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56393324/