Sass包括和Webjars

Question

我将一个Play项目迁移到2.3，并使用ShaggyYeti的sbt-sass插件编译我的SCSS文件(这是对play sass插件的更改)。我把所有的东西都打包成一个小型的css，放在/assets/stylesheets/main.min.css中。一切正常工作，直到我开始使用webjars的前端库。

webjars本身工作正常，我可以将scss绑定到我的主要css中，但是将scss与引用其他资源的webjars捆绑在一起存在问题。例如，字体-太棒了将被下载到lib/font-awesome中，字体位于/assets/lib/font-awesome/fonts/fontawesome-webfont.eot这样的位置。问题是字体-令人敬畏的scss使用../fonts/fontawesome-webfont.eot引用它，编译后将是/assets/fonts/fontawesome-webfont.eot。

我是在这里遗漏了什么，还是这些怪癖还没有解决，因为这个新系统已经建立了很短的时间？如果是后者，你认为哪一个是合适的解决办法？

1. 是否应该使用插件来移动/复制预期文件夹中的引用文件？或
2. SCSS编译器/插件应该重写到webjar下载文件夹的路径吗？或
3. 我应该包括字体-令人敬畏的小型css作为一个单独的链接吗？

我倾向于认为(2)是正确的解决方案，因为webjar中的scss显然是相对于scss引用的资源。应该相对于目标css重写。

Answer 1

这应该有更好的支持，我在模板中直接声明引用：

<link rel="stylesheet" href="@routes.WebJarAssets.at(WebJarAssets.locate("font-awesome.min.css"))" />

在尝试导入字体之前，我的主要内容是：

@import "lib/font-awesome/less/font-awesome.less";

但是进口品就像你说的那样不起作用。问题是，如果你想定制更少的(这是使用较少的原因)，你不能做的海峡前进。另一项工作是将字体文件夹放在公用文件夹中，然后一起提交。

这个问题也发生在sass和其他资源中。

Answer 2

您只需将以下一行添加到您的_variable.scss

$fa-font-path: "/assets/lib/font-awesome/fonts";

见此处：http://fortawesome.github.io/Font-Awesome/get-started/#custom-less

Answer 3

由于@GSP59 59，我可以通过在字体-可怕的scss导入之前将以下行添加到我的main.scss文件中来解决这个问题：

$fa-font-path: "../lib/font-awesome/fonts";
@import "lib/font-awesome/scss/font-awesome.scss";

请注意，如果您没有这样的文件，则不需要将它添加到_variables.scss中。