Как автоматически скомпилировать LESS в CSS на сервере?

мой друг дизайнер компилировал свой файл вручную и загружал его с помощью кода (удаленный сайт), тратя много драгоценного времени. Он спросил меня:--1-->

можно ли автоматически обнаружить изменение файла на сервере Linux и скомпилировать его без задержки?

10
css events iowait less linux

3 ответов

Я сделал скрипт и публикую подробности:

  • простота в использовании для дизайнеров
  • выполняет меньше компилятора сразу после сохранения файла, не потребляя ресурсы сервера
  • любой редактор, способный к удаленному редактированию, будет работать с этим решением-Code, Sublime Text, Textmate

во-первых, вам нужно установить "npm" на сервере, введя это в консоль:

sudo apt-get install npm inotify-tools
sudo npm install -g less
sudo nano /usr/local/bin/lesscwatch

вставьте следующий файл:

#!/bin/bash
# Detect changes in .less file and automatically compile into .css
[ "" ] || { echo "Specify both .less and .css files"; exit 1; }
inotifywait . -m -e close_write | while read x op f; do.
    if [ "$f" == "" ]; then.
        lessc $f >  && echo "`date`: COMPILED";.
    fi
done

сохранить, выйти, затем выполнить:

sudo chmod +x /usr/local/bin/lesscwatch

вы все сделали. В следующий раз, когда вам нужно будет работать с вашими меньшими файлами, вам нужно будет открыть терминал (у кода есть встроенный), перейти в папку вашего файла (используя cd) и выполнить это:

lesscwatch main.less main.css

Он выведет информацию об успешных компиляциях или ошибках. Наслаждаться.

10

Я изменил решение @romaninsh, чтобы оно перекомпилировалось при изменении меньшего количества файлов в каталоге. Я также добавил оператор echo перед компиляцией меньше файлов, чтобы обеспечить некоторую проверку того, что изменение было обнаружено в случае компиляции занимает несколько секунд.

/ usr / local / bin / lesscwatch:

#!/bin/bash                                                                     
# Detect changes in .less file and automatically compile into .css                 
[ "" ] || { echo "Specify both .less and .css files"; exit 1; }                  
inotifywait . -m -e close_write | while read x op f; do                            
    if [[ "$f" == *".less" ]]; then                                                
        echo "Change detected. Recompiling...";                                    
        lessc  >  && echo "`date`: COMPILED";                                                                                                                           
    fi                                                                             
done

Это более близко имитирует поведение Less.приложение для Mac, к которому я привык.

при разработке с меньшим, я обычно имейте кучу файлов в каталоге / style моего проекта и скомпилируйте все в один.css-файл с использованием переопределений.

пример использования:

базы.меньше:

@import "overrides.less";
@import "variables.less";

body {
   ...
}

использование такое же, как 

lesscwatch base.less base.css
3

Я хотел бы сценарий bash, но у меня были некоторые проблемы с его использованием с sublime wthin ubuntu 12.10 . что ж, сценарии сделали то же самое Ian_Marcinkowski тут, но я уверен, что он продолжает работать после первого события и контролирует все файлы (sublime text someway, используйте файл tmp и не меняйте исходный - !?!).

#!/bin/bash
# Detect changes in .less file and automatically compile into .css
[ "" ] || { echo "Specify both .less and .css files"; exit 1; }
inotifywait -m -e close_write . | while read x op f; do
    echo $f
    echo "Change detected. Recompiling...";
    lessc  >  && echo "`date`: COMPILED";
done

вызов скрипта как :

./monitor.sh  </path/to/dir>  <main.less> <main.css>
2