Я пытался интегрировать Salvattore (альтернатива масонства в CSS) в мое приложение Aurelia , но, к сожалению, оно не работает.После многих испытаний я разочарован и думаю, что возможно, что Salvattore вообще не может работать в приложении Aurelia.
Вот что я сделал: я создал новый проект Aurelia благодаря CLIau new и внутри этого проекта я создал html-страницу внутри моего проекта Aurelia с этим кодом:
<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%; }
Сначала я попытался просто сослатьсяJS-код Сальватторе внутри моей страницы index.html (чуть выше тега закрытия тела) выглядит так:
<!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>
Не работает, я получил ошибки в консоли.
Я также пытался установить Salvattore через npm, установить salvattore --save и добавить его в aurelia.json.В main.ts я пытался сослаться на него: import 'salvattore';, но он тоже не работает.Я имею в виду, никаких ошибок на этот раз, но ничего не произошло.Наконец, в конце я попытался внедрить js-скрипт Salvattore прямо в мою страницу благодаря компоненту scriptinjector .Еще раз, это не работает, ничего не произошло.
Должен ли я сделать вывод, что Salvattore просто не совместим с какими-либо проектами Aurelia?В таком случае, знаете ли вы какую-либо альтернативу?
Ниже примера кода с помощью Salvattore на базовой html-странице (не Aurelia)
https://codepen.io/mitour/pen/wWMOvw