Java Web应用程序的即时LESS编译器？

Question

我正在寻找一种在开发期间通过服务器端编译CSS LESS文件的方法。例如，如果浏览器请求/assets/css/foo.css，我希望服务器能够注意到存在/assets/css/foo.less文件，并将该文件编译为CSS并返回结果。我猜测肯定有一个LESS servlet可以做到这一点。

我正在运行带有Spring MVC应用程序的Tomcat 7。

如何配置Java Web应用程序以进行实时LESS编译？

- ams

Answer 1

我认为你正在寻找的是一个Servlet Filter。 我之前不知道有现成的可以进行LESS编译的过滤器，本来想使用lesscss-java开始制作一个，但现在我发现有一个更大的项目叫做Web Resource Optimizer for Java - wro4j，其中包含了服务器端的LESS支持。

- Jason Sperske

---

关于使用wro4j进行即时less编译的提示：http://code.google.com/p/wro4j/wiki/AbstractProcessorsFilter - Alex Objelean

@AlexObjelean 如果您只想在开发过程中使用筛选器，该怎么办？ - dtrunk

WroFilter有一个启用/禁用标志。您只能在开发中设置它，一切都应该正常工作，无需进行其他更改。 - Alex Objelean

Answer 2

在构建web应用程序时，将您的less文件编译为css文件会更简单（且更有效）。例如，在使用Maven时，我们使用lesscss-maven-plugin（compile目标，process-sources阶段）从less文件生成css文件。然后只使用和打包css文件到web应用程序中。不会动态使用less文件。
另一个优点是，在部署web应用程序之前编译less文件，因此可以更早地检测到编译错误。

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>

- Guillaume Husta

---

在进入生产之前，我同意这很好，但当设计师只是在调整设置时，每次更改一点东西都运行Maven会影响生产效率。 - ams

Answer 3

我们所做的是有两种模式：开发和生产。

对于开发模式，使用官方的less css js编译器，在运行时进行编译。

<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中

对于生产环境，请使用编译后的样式，通过https://github.com/marceloverdijk/lesscss-maven-plugin进行编译。

<link type="text/css" rel="stylesheet" href="${staticContext}/css/style.css" />

- chpopov