Я изучаю, как использовать Compass из учебника, которому около 4 лет. Моя проблема заключается в том, что спрайты не загружаются вообще, хотя каталог, указанный в ошибке, является правильным расположением спрайтов.Sprite loading in compass
Я получаю эти сообщения об ошибках: два
Failed to load resource: net::ERR_EMPTY_RESPONSE (12:12:47:223 | error, network)
at http://localhost:8383/images/spr-sf52e1e883c.png
Failed to load resource: net::ERR_EMPTY_RESPONSE (12:13:45:615 | error, network)
at http://localhost:8383/images/pitch-s4b17d3ee2e.png
Это выглядит как правильный адрес для меня, учитывая структуру каталогов моего проекта. См. Прикрепленное изображение.
Я обнаружил, что мои спрайт-файлы находятся в неправильном месте, или мой сгенерированный css неверен в том месте, где находятся файлы спрайтов. Ниже приводится генерация кода в CSS.
/* ===================================================== */
/* Sprites
/* ===================================================== */
.spr-sprite, header h1 {
background-image: url('/images/spr-sf52e1e883c.png');
background-repeat: no-repeat;
}
.pitch-sprite, .pitch.left div, .pitch.middle div, .pitch.right div {
background-image: url('/images/pitch-s4b17d3ee2e.png');
background-repeat: no-repeat;
}
То, что работает для резервного копирования одного каталога в вызывающем спрайта:
.spr-sprite, header h1 {
background-image: url('../images/spr-sf52e1e883c.png');
background-repeat: no-repeat;
}
.pitch-sprite, .pitch.left div, .pitch.middle div, .pitch.right div {
background-image: url('../images/pitch-s4b17d3ee2e.png');
background-repeat: no-repeat;
}
Теперь я могу видеть спрайтов.
То, что я не знаю, где искать, чтобы решить эту проблему, и я надеюсь, что мое описание достаточно для кого-то, чтобы предложить мне советы
Все мои исследования указывают на использование параметра конфигурации «relative_assests = истина» , чтобы разрешить это, но я не могу убедить мой проект компаса дать мне относительные каталоги «../» для моих спрайтов. Я скомпилирую спрайты с этим файлом конфигурации.
/* ===================================================== */
/* Sprites
/* ===================================================== */
@import "spr/*.png";
@import "pitch/*.png";
И это мой config.rb
# Require any additional compass plugins here.
# -----------------------------------------------------------------------------
project_path = File.expand_path("..",File.dirname(__FILE__))
# Set this to the root of your project when deployed:
# -----------------------------------------------------------------------------
relative_assets = true
http_images_dir = "images"
http_path = "/"
css_dir = "css"
sass_dir = "scss"
images_dir = "images"
javascripts_dir = "js"
# Output style and comments
# -----------------------------------------------------------------------------
# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed
# Over-ride with force compile to change output style with: compass compile --output-style compressed --force
output_style = :expanded
#environment = :development
line_comments = false
cache = true
color_output = false # required for Mixture
require 'sass-globbing'
# Obviously
preferred_syntax = :scss
# SASS core
# -----------------------------------------------------------------------------
# Chrome needs a precision of 7 to round properly
Sass::Script::Number.precision = 7
Интересно, если кто-то видит проблему