2012-12-13 70 views
14

我正在尋找一種在開發過程中按需要在服務器端編譯CSS LESS文件的方法。例如,如果瀏覽器向/assets/css/foo.css發出請求,我希望服務器注意到有一個/assets/css/foo.less文件,然後將該文件編譯並返回結果的css。我猜測必須有一個LESS servlet能夠做到這一點?用於java web應用程序的動態LESS編譯器?

我運行Tomcat 7與Spring MVC應用

如何配置Java Web應用程序對飛LESS編譯呢?

回答

14

我覺得你在找什麼是Servlet Filter。我不知道一個現成的一個沒有編譯,並已開始使用lesscss-java,但現在我可以看到有一個更大的項目稱爲Web Resource Optimizer for Java - wro4j與服務器端LESS support

+1

<link type="text/css" rel="stylesheet/less" href="${...}/style.less" /> <script>(window.less = window.less || {}).env = 'development';</script> <script src="${staticContext}/lib/less-1.3.3.js"></script> 

在你的HTML

的督促,使用編譯樣式:

用於開發,使用官方少CSS JS編譯器,彙編上飛只是關於使用wro4j進行少量編譯的提示:http://code.google.com/p/wro4j/wiki/AbstractProcessorsFilter –

+0

@AlexObjelean如果您想要使用過濾器,該怎麼辦?僅在開發過程中? – dtrunk

+0

WroFilter有一個啓用/禁用標誌。您可以將其設置爲僅開發,並且所有內容都應該可以在沒有其他更改的情況下使用 –

7

這將是更簡單(和更有效的)首先編譯您的Web應用程序的編譯過程中,您的較少的文件到CSS文件。
作爲一個例子,使用Maven的情況下,我們使用lesscss-maven-plugin編譯目標,過程來源相),以從更小的文件生成CSS文件。然後,只有文件被使用並打包在webapp中。否較少文件是動態使用的。
另一個優點是,在部署webapp之前編譯的文件較少,因此編譯錯誤可以在更早的時候檢測到。

結構示例的pom.xml:

<plugin> 
    <groupId>org.lesscss</groupId> 
    <artifactId>lesscss-maven-plugin</artifactId> 
    <version>1.3.0</version> 
    <configuration> 
     <sourceDirectory>${project.basedir}/src/main/webapp/less</sourceDirectory> 
     <outputDirectory>${project.build.directory}/${project.build.finalName}/css</outputDirectory> 
     <compress>true</compress> 
     <includes> 
      <include>main.less</include> 
     </includes> 
    </configuration> 
    <executions> 
     <execution> 
      <goals> 
       <goal>compile</goal> 
      </goals> 
     </execution> 
    </executions> 
</plugin> 
+9

我認爲這是很好的,然後進入生產時,當設計師只是擺弄設置運行maven每次你改變一個小東西殺死生產力 – ams