I am looking for a way to compile CSS LESS files on the server side on demand during development. For example if the browser makes a request to /assets/css/foo.css I want the se
It would be simpler (and more effective) to first compile your less files to css files, during the build of your webapp.
As an example, when using Maven, we use the lesscss-maven-plugin (compile goal, process-sources phase) to generate css files from less files. Then only the css files are used and packaged in the webapp. No less files are used dynamically.
Another advantage is that less files are compiled before the webapp is deployed, so compilation errors are detected sooner.
Configuration example in 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>
What we do is we have two modes : dev and production.
For dev, use the official less css js compiler, which compiles on the fly:
<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>
in your HTML
for prod, use the compiled styles by https://github.com/marceloverdijk/lesscss-maven-plugin
<link type="text/css" rel="stylesheet" href="${staticContext}/css/style.css" />
I think what you are looking for is a Servlet Filter. I was not aware of an off the shelf one that does LESS compiling and would have started to make one using lesscss-java, but now I can see there is a larger project called Web Resource Optimizer for Java - wro4j with server side LESS support.