Изменение пути шрифта к относительному при загрузке из пакета

Я поставил плагины css файл как

 StyleBundle adminArea = new StyleBundle("~/files/css/admin/common");
 adminArea.Include("~/assets/global/plugins/font-awesome/css/font-awesome.css");

так как шрифт awesome использует свой шрифт, который находится в его каталоге, я скопировал его шрифты, расположенные в этом каталоге плагинов, в папку fonts на корневом уровне и изменил расположение в файле css как

@font-face {
  font-family: 'FontAwesome';
  src: url('/fonts/fontawesome-webfont.eot?v=4.4.0');
  src: url('/fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), 
      url('/fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), 
      url('/fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), 
      url('/fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),
       url('/fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

Когда запрашивается этот пакет, шрифт удивительный точечный шрифт файла css, используя относительный путь в качестве URL-адреса источника шрифта, меняется на../fonts/*.eot?v=4.4.0

@font-face{
font-family:'FontAwesome';
src:url('../fonts/fontawesome-webfont.eot?v=4.4.0');
src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'),
url('../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'),
url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'),
url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),
url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
font-weight:normal;
font-style:normal
}

Который делает запрос идет к виртуальному пути, созданному для пакета, где шрифт не размещен.

Моя путаница заключается в том, почему пакетирование изменило абсолютный путь шрифта к относительному пути. Как я могу решить эту проблему, не создавая структуру папок, как я создал для пакета? MVC версии 5 .NET Framework: 4.5

Заметка

  1. Я изменил шрифт url только в неунифицированной версии css, минимизированная версия никак не затрагивается.
  2. Я также включил оптимизацию в связке.

1 ответ

Я не знаю, как это обрабатывается или реализуется в пакетировании и минимизации, но следующее решение сработало для меня, и я надеюсь, что это будет работать для кого-то, кто сталкивается или столкнется с проблемой, как я.

Как я уже сказал, я изменил путь шрифта только в неунифицированной версии css, а минимизированная версия css остается нетронутой.

В то время как вы включаете оптимизацию в комплекте, который включает в себя unminified версию css, и у вас есть уменьшенная версия css для того же файла, например

Sample.css и Sample.min.css

Тогда создание пакета и минимизации займет оригинальную минимизированную версию CSS, а не минимизированную минимизированную версию CSS.

Таким образом, изменение пути шрифта в обоих файлах решит проблему. Это также должно относиться к изображениям.

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