15

我正在寻找一种在开发过程中按需在服务器端编译 CSS LESS 文件的方法。例如，如果浏览器向 /assets/css/foo.css 发出请求，我希望服务器注意到有一个 /assets/css/foo.less 文件，然后编译该文件并返回结果 css。我猜一定有一个LESS servlet可以做到这一点？

我正在使用 Spring MVC 应用程序运行 tomcat 7

如何配置 Java Web App 以进行动态 LESS 编译？

4

3 回答 3

15

我认为您正在寻找的是Servlet Filter。我不知道有一个现成的可以进行 LESS 编译并且会开始使用lesscss-java进行编译的，但是现在我可以看到有一个更大的项目，名为Web Resource Optimizer for Java-wro4j，具有服务器端LESS 支持。

于 2012-12-13T21:32:32.210 回答
7

在构建 webapp 期间，首先将 less 文件编译为 css 文件会更简单（也更有效）。
例如，在使用Maven时，我们使用lesscss-maven-plugin（编译目标，进程源阶段）从 less 文件生成 css 文件。然后只使用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>
于 2012-12-13T21:54:09.653 回答
5

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

对于 dev，使用官方的 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 中

对于 prod，请使用https://github.com/marceloverdijk/lesscss-maven-plugin编译的样式

<link type="text/css" rel="stylesheet" href="${staticContext}/css/style.css" />
于 2013-04-16T23:18:33.663 回答