Grunt Build неправильно оптимизирует CSS-URL

Я использую Backbone Boilerplate и добавил зависимость bower Ratchet 2.*, затем импортирую ее в свой файл styles/index.css из его исходной папки bower:

@import "../../vendor/bower/ratchet/dist/css/ratchet.css";

Это захватывает файл правильно, но по какой-то причине при сжатии он меняет URL в моем селекторе @ font-face.

Оригинальный селектор выглядит так:

@font-face {
  font-family: Ratchicons;
  font-style: normal;
  font-weight: normal;
  src: url("app/fonts/ratchicons.eot");
  src: url("app/fonts/ratchicons.eot?#iefix") format("embedded-opentype"), 
       url("app/fonts/ratchicons.woff") format("woff"), 
       url("app/fonts/ratchicons.ttf") format("truetype"), 
       url("app/fonts/ratchicons.svg#svgFontName") format("svg");

После запуска задачи grunt мой новый оптимизированный style.css для этого селектора выглядит так:

@font-face {
    font-family: Ratchicons; font-style: normal; font-weight: normal; 
    src: url("/app/img/vendor/bower/ratchet/dist/css/app/fonts/ratchicons.eot?#iefix") format("embedded-opentype"), 
         url("app/fonts/ratchicons.woff") format("woff"), 
         url("app/fonts/ratchicons.ttf") format("truetype"), 
         url("app/fonts/ratchicons.svg#svgFontName") format("svg");
}

(разрывы строк были добавлены для отображения здесь)

Вы заметите, что вся первая строка:

src: url("app/fonts/ratchicons.eot");

был полностью удален, и следующая строка должна быть:

src: url("app/fonts/ratchicons.eot?#iefix") format("embedded-opentype"),

но стал:

src: url("/app/img/vendor/bower/ratchet/dist/css/app/fonts/ratchicons.eot?#iefix") format("embedded-opentype"), 

Я не могу понять или объяснить, почему это происходит, но мне нужно, чтобы это было решено.

Я проверил раздел стилей моего gruntfile, и он выглядит так:

styles: {
  // Out the concatenated contents of the following styles into the below
  // development file path.
  "dist/styles.css": {
    // Point this to where your `index.css` file is location.
    src: "app/styles/index.css",

    // The relative path to use for the @imports.
    paths: ["app/styles"],

    // Rewrite image paths during release to be relative to the `img`
    // directory.
    forceRelative: "/app/img/"
  }
},

Я предполагаю, что по какой-то причине оптимизатор стиля добавляет URL-адрес forceRelative к исходному URL-адресу../fonts/ fontfile, но я не могу объяснить, почему и что делать.

Помощь приветствуется.

0 ответов

Другие вопросы по тегам