指南针spriting

时间:2012-06-07 07:43:58

标签: css sass compass-sass

为了按照the documentation按照罗盘实现精灵,我写了这个:

// web/sass/icons.scss
@import "../images/icons/*.jpg"; // for any cases also tried .png 
@include all-icons-sprites;

并收到错误:

error sass/icons.scss (Line 2: File to import not found or unreadable: ../images/icons/*.jpg.

我不认为路径是错误的,因为也尝试了完整路径。

结构是这样的:

+ web
  - sass
     + icons.scss
     + ...
  - images
     + icons
       - icon1.jpg
       - icon2.jpg
       - ...

2 个答案:

答案 0 :(得分:7)

精灵的指南针使用config.rb中定义的路径。

所以如果你有这个结构:

+ web
  + sass
    - icons.scss
  + images
    + icons
      - icon1.png
  + config.rb

在你的config.rb中,你应该有类似的东西:

...
images_dir = "images"
sass_dir = "sass"
...

然后在你的icons.scss中你应该这样做:

// web/sass/icons.scss
@import "icons/*.png"; // for any cases also tried .png 
@include all-icons-sprites;

因为导入是相对于我们在上面定义的images目录。

请务必了解配置文件,因为它可能很棘手http://compass-style.org/help/tutorials/configuration-reference/

答案 1 :(得分:0)

这个线程很安静,但很酷的解决方案,用指南针精神充沛 on github