1

我不确定我做错了什么——我正在尝试使用 Compass/Sass 生成一个精灵表。我有一个非常常见的文件夹结构：

- www
    + config.rb
    - img
        - common
            - team
                + team-member1.jpg
                + team-member2.jpg (etc)
    - scss
        - global
            - _utilities.scss (etc)

我的 config.rb 文件位于根 www 目录中。以下是该文件的内容：

require 'compass/import-once/activate'
# Require any additional compass plugins here.

# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "scss"
images_dir = "img"
javascripts_dir = "js"
fonts_dir = "fonts"

output_style = :nested
environment = :development

# To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true

line_comments = false
color_output = false

preferred_syntax = :scss

这是我为生成精灵表而输入的内容：

@import "compass/utilities/sprites";
@import "common/team/*.jpg";
@include all-team-sprites;

我已经尝试了多种方法。我省略了 compass/utilities/sprites 导入。我在第二个 @import 语句中更改了文件夹目录。我已经尝试了以下所有变体：

@import "../img/common/team/*.jpg";
@import "img/common/team/*.jpg";
@import "/common/team/*.jpg";
@import "common/team/*.jpg";

没有任何效果。这是我从 Codekit 得到的错误：Compass 无法编译项目中的一个或多个文件：

error styles.scss (Line 47 of _utilities.scss: File to import not found or unreadable: common/team/*.jpg.
Load paths:
  /Applications/AMPPS/www/mysite/www/scss
  /Applications/CodeKit.app/Contents/Resources/engines/compass/compass-core/stylesheets
  /Applications/AMPPS/www/mysite/www/scss
  Compass::SpriteImporter)
overwrite styles.css
4

1 回答 1

3

Sprites 仅适用于 PNG，因为与 JPG 不同，它是一种无损图像压缩格式。
实际上，已经压缩的 JPG 图像会因为创建精灵图的第二次压缩而失去质量。

于 2014-06-30T23:25:27.113 回答