【问题标题】:Compass sprite generation not working指南针精灵生成不起作用
【发布时间】:2014-08-21 05:40:38
【问题描述】:

我不确定我做错了什么——我正在尝试使用 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 

【问题讨论】:

标签: sass compass-sass sprite codekit


【解决方案1】:

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

【讨论】:

  • 我不喜欢它,但它很有意义。感谢您的回答!
猜你喜欢
  • 2013-04-13
  • 1970-01-01
  • 2012-06-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-02-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多