Компас дает ошибку Нераспознанный тип файла: png'))

Я работаю над проектом moovweb, который использует компас. Прямо сейчас я реализую поддержку 2x изображений для спрайтов.

Что я делаю, так это чтобы компас генерировал 1x спрайт, вот так:

$icons-dimensions: true;
@import "icons/*.png";
@include all-icons-sprites;

И затем, сразу после этого, я включаю и выполняю файл scss, который сгенерирует правила спрайта для 2x (с использованием медиа-запросов):

@import "../_retina-sprites.scss";
$icons2x: sprite-map("icons2x/*.png");
.icons-logo {
  @include retina-sprite(logo, $icons2x);
}

.icons-bag {@include retina-sprite (bag, $ icons2x); }

Я создал этот _retina-sprites.scss (на основе версии Адама Бродзинского), чтобы он содержал миксин для добавления правила медиазапроса для выбора 2x изображений, например:

@import "compass/utilities/sprites";         // Include compass sprite helpers
@import "compass/css3/background-size";      // Include helper to calc background size

@mixin retina-sprite($name, $sprites2x) {
  background-repeat: no-repeat;
  @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
    & {
      $pos: sprite-position($sprites2x, $name);
      background-image: sprite-url($sprites2x);
      background-position: nth($pos, 1) / 2 nth($pos, 2) / 2;
      @include background-size(ceil(image-width(sprite-path($sprites2x)) / 2) auto);
    }
  }    
}

Тем не менее, я получаю этот вывод при генерации спрайта в строке, которая вызывает sprite-path():

Syntax error: Unrecognized file type: png'))

Что заставляет меня думать, что компас пишет sprite-url вместо sprite-path, следовательно, давая ')) суффикс к имени файла.

Кто-нибудь входил в это раньше?

Источник

3 ответа

Решение

Не уверен, в чем может быть проблема, но вы можете запустить компас напрямую, чтобы получить лучший вывод или понимание того, что происходит.

Moov SDK использует следующую команду compass для компиляции ваших ресурсов:

compass compile <my-project-path>/assets --relative-assets --sass-dir stylesheets --css-dir stylesheets/.css --images-dir images --require sass/plugin

Надеемся, что запуск этого вручную предоставит вам больше информации.

Источник

Я столкнулся с этой ошибкой сегодня.

Это было на самом деле из-за пустых (как в 0kb) файлов PNG

Источник

Я получил ту же ошибку, когда у меня были изображения JPG в том же каталоге, что и PNG, как ни странно.

Как только я удалил эти JPG, это сработало.

Источник
Другие вопросы по тегам