Combres и DotLessCssFilter - PullRequest
Новая
       39

Combres и DotLessCssFilter

3 голосов
/ 27 января 2011

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

Я пытаюсь заставить combres работать с моим бритвенным приложением MVC 3. И у меня есть все для работы, кроме DotLessCssFilter.

В документации написано In order to apply a filter to your resource sets, you need to modify your Combres config file

Я изменил combres.config так: 

<combres xmlns='urn:combres'>
    <filters>
        <filter type="Combres.Filters.DotLessCssFilter, Combres" acceptedResourceSets="dotLessCss" />
    </filters>
    <resourceSets url="~/combres.axd" defaultDuration="30" defaultVersion="1" defaultVersionGenerator="Combres.VersionGenerators.Sha512VersionGenerator">
        <resourceSet name="siteCss" type="css">
            <resource path="~/UI/Styles/1140.css" />
            <resource path="~/UI/Styles/typeimg.css" />
            <resource path="~/UI/Styles/layout.css" />
        </resourceSet>
        <resourceSet name="siteJs" type="js">
            <resource path="~/UI/Scripts/opt/util.js" />
            <resource path="~/UI/Scripts/opt/core.js" />
        </resourceSet>
    </resourceSets>
</combres>

И он объединяет файлы и минимизирует их как следует.

В одном из моих файлов у меня есть простой менее-синтаксис: 

@sprite: url(/ui/styles/sprite.png);

.foo {
  background-image: @sprite;
}

Но похоже, что он никогда не проходит через фильтр.

Не знаю, является ли это проблемой MVC или общей.

Кто-нибудь успешно использовал этот фильтр?

Неважно! (EDIT)

См. Ответ

Ответы [ 2 ]

1 голос
/ 20 февраля 2012

На самом деле вам не нужно иметь acceptResourceSets, если вы не хотите.

Вот пример файла Combres.xml из тестового проекта, который я сделал как POC (см. Комментарии): 

<?xml version="1.0" encoding="utf-8"?>
<combres xmlns="urn:combres">
  <filters>
    <!-- This filter allows relative urls to be used in Css files like in .NET; e.g. "~/MyFolder/MyPic.png"-->
    <filter type="Combres.Filters.FixUrlsInCssFilter, Combres" />
    <!-- This filter allows you to define variables in a CSS file and reuse them throughout the file. -->
    <filter type="Combres.Filters.HandleCssVariablesFilter, Combres" />
    <!-- This filter changes Combres order of ops so that common css variables can be defined in a single
         file and used throughout multiple css files, instead of having to define them in each file. -->    
    <filter type="Combres.Filters.DotLessCssCombineFilter, Combres" />
  </filters>
  <resourceSets defaultDebugEnabled="false" 
                defaultDuration="30" 
                defaultIgnorePipelineWhenDebug="true" 
                defaultVersion="auto" 
                localChangeMonitorInterval="30" 
                remoteChangeMonitorInterval="60" 
                url="~/combres.axd">
    <resourceSet name="siteCss" type="css">
      <resource path="~/content/Variables.css" />
      <resource path="~/content/Test1.css" />
      <resource path="~/content/Test2.css" />
      <resource path="~/content/Site.css" />
    </resourceSet>
    <resourceSet name="siteJs" type="js">
      <resource path="~/scripts/jquery-1.7.1.min.js" />
      <resource path="~/scripts/jquery-ui-1.8.17.min.js" />
      <resource path="~/scripts/jquery.unobtrusive-ajax.min.js" />
      <resource path="~/scripts/modernizr-1.7.min.js" />      
    </resourceSet>
  </resourceSets>
</combres>

Variables.css: 

@sprite: url('~/Content/ui/styles/sprite.png');

Test1.css:

.fooTest1 {background-image: @sprite;}

Test2.css:

.fooTest2 {background-image: @sprite;}

Вывод (через вкладку Firebug .NET): 

.fooTest1{background-image:url("/Content/ui/styles/sprite.png")}.fooTest2{background-image:url("/Content/ui/styles/sprite.png")}

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

Затем вы можете определить переменные CSS в каждом из ваших файлов CSS (без повторного использования).

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

Буу Нгуен проделал большую работу в проекте Combres.

1 голос
/ 06 сентября 2011

Пропустил acceptedResourceSets="dotLessCss", оно должно иметь правильное имя набора ресурсов, поэтому в моем случае:

acceptedResourceSets="siteCss"

...