ASP.NET MVC 4 Минификация и фоновые изображения - PullRequest
Новая
       1

ASP.NET MVC 4 Минификация и фоновые изображения

8 голосов
/ 20 марта 2012

В настоящее время я использую ASP.NET MVC 4 CSS / JavaScript Optimizer.Он хорошо работает с моим собственным CSS / JavaScript, но я также хочу использовать его с плагинами.Каждый плагин имеет свою собственную папку: 

~/Content/css // my own css, ok
~/Content/plugins/rateit
~/Content/plugins/chosen
~/Content/plugins/...

Я могу добавить эти файлы в оптимизатор: 

var bundle = new Bundle("~/Content/opt", new CssMinify());
...
bundle.AddFile("~/Content/plugins/chosen/chosen.css", "*.css");
BundleTable.Bundles.Add(bundle);

Но в этом случае после оптимизации css находится в другой папке, и браузер не может найтифоновые изображения больше.Есть ли решение для автоматического изменения пути CSS для фоновых изображений?

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

Ответы [ 2 ]

4 голосов
/ 20 июня 2013

У меня была такая же проблема ... Я использовал для сборки jQuery UI CSS свой собственный, но, как вы упомянули, плагины используют свой собственный каталог.В моем случае это было: 

~/Content/Site.css
~/Content/themes/base/*.css

Этот свернутый пакет ищет все изображения в ~ / Content /, поэтому пользовательский интерфейс jQuery перестает работать должным образом.Так что единственный способ решить эту проблему - разделить эти CSS (мой и пользовательский интерфейс jQuery).

Кстати: до этого я не понимал, почему CSS связаны (в шаблоне MVC4) как ~/content/ вместо ~/bundles/.Теперь я знаю, что это из-за проблемы с путем к изображениям в каталоге Content.

4 голосов
/ 20 марта 2012

Можно взглянуть на RequestReduce . Это еще один минификатор / пакет, основанный на .net, и он перепишет все URL-адреса в минимизированном / пакетном css как абсолютные. Это включает в себя шрифты и фоновые изображения. Это также автоматически расширит любой импорт в CSS. Кроме того, если он считает, что может, то он будет спрайтовать фоновые изображения.

...