将 SASS 文件编译到具有相对 assets/urls 的单独文件夹中？

Question

我有自己的 Grunt/Compass/SASS 项目，其中的 config.rb 文件具有以下设置：

http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
add_import_path "./bower_components/slick-carousel/slick"

您可能猜到了，这里的问题是我试图与其他 sass 文件一起编译的 slick-carousel。没有那个组件它工作正常。 slick 文件夹包含这些文件：

./ajax-loader.gif
./config.rb
./fonts
./fonts/slick.eot
./fonts/slick.svg
./fonts/slick.ttf
./fonts/slick.woff
./slick-theme.css
./slick-theme.scss
./slick.css
./slick.js
./slick.min.js
./slick.scss

编译 slick-theme.scss 时，我收到警告，提示找不到通过相对 URL 引用的文件。

WARNING: 'slick.woff' was not found (or cannot be read) in /project-root/fonts

有没有办法告诉 Compass/SASS 编译器使用 "current" SASS 文件作为相对路径的基础？所以它会在 /project-root/bower_components/slick-carousel/slick/fonts 中查找？

Answer 1

Slick.js 有自己的 Sass 变量来处理他的字体 url。因此，您必须像这样正确地为该变量分配正确的路径：

// Fonts
$slick-font-path: "./bower_components/slick-carousel/slick/fonts/";

您可以检查所有 slick 的 Sass 变量 here

将 SASS 文件编译到具有相对 assets/urls 的单独文件夹中？

Compile SASS files in separate folder with relative assets/urls?

sass

gruntjs

grunt-contrib-compass

compass