На лету компилятор LESS для Java-приложения? - программирование
Подтвердить что ты не робот

На лету компилятор LESS для Java-приложения?

Я ищу способ скомпилировать файлы CSS LESS на стороне сервера по запросу во время разработки. Например, если браузер делает запрос /assets/css/foo.css, я хочу, чтобы сервер заметил, что есть файл /assets/css/foo.less, а затем, чтобы этот файл выполнялся, и полученный css возвращался. Я предполагаю, что где-то там должен быть сервлет LESS, который может это сделать?

Я запускаю tomcat 7 с приложением Spring MVC

Как настроить Java Web App для выполнения компиляции LESS на лету?

4b9b3361

Ответ 2

Это было бы проще (и более эффективно), чтобы сначала скомпилировать ваши меньше файлов для файлов css, во время сборки вашего webapp.
Например, при использовании Maven мы используем lesscss-maven-plugin (цель компиляции, фаза процессов) генерировать 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>

Ответ 3

Что мы делаем, мы имеем два режима: dev и production.

Для dev используйте официальный компилятор 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" />