Prepros: open-source компилятор файлов для front-end разработки



    Здравствуйте, уважаемые Хабражители.

    Данная статья посвящена фантастическому, на мой взгляд, open-source приложению Prepros, которое может облегчить рабочий процесс многим фронт-энд разработчикам.

    Prepros умеет компилировать файлы LESS, Sass, SCSS, Stylus, Jade, Slim, Coffeescript, LiveScript, Haml и Markdown, минифицировать и объединять в один JavaScript-файлы и это еще не все.

    Под катом — более подробный обзор приложения.



    Возможности Prepros


    Возможности приложения перечислены в информации о проекте на GitHub:

    • компиляция файлов less, sass, scss, compass, coffeescript, stylus, jade, slim, markdown, haml и livescript;
    • приложение не зависит от того, установлены ли в системе соответствующие программы и библиотеки (sass, compass и т.п);
    • возможность оптимизировать изображения;
    • обновление страниц в браузере в реальном времени;
    • минификация и объединение файлов JavaScript;
    • отслеживание директив import;
    • гибкие настройки;
    • система вывода ошибок и оповещений (логов);
    • встроенный http-сервер.

    Создание http-сервера производится с целью просмотра проекта с различных устройств по установленному адресу; при таком просмотре поддерживается возможность LiveReload'а — обновления проекта в браузерах всех устройств в реальном времени.

    В настоящее время существуют версии приложения для Windows и MacOS, также имеется расширение для Google Chrome, обеспечивающее возможность LiveReload. В планах — аналогичное расширение для FireFox.

    Обзор интерфейса




    Приложение выполнено в современном flat-стиле; приложение можно свернуть в трей, что удобно.

    Интерфейс приложения, по сути, прост и интуитивно понятен. Слева в сайдбаре выводится список ваших проектов, центральная часть отведена на список файлов, справа находится меню для работы с отдельным файлом.

    Сверху справа — меню глобальных настроек приложения.

    В левом сайдбаре внизу — меню работы с проектом, позволяющее настроить проект: папки, в которые по умолчанию компилируются файлы соответствующих типов, параметры создания http-сервера, а также переход в меню оптимизации изображений.



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

    При активированной опции автокомпиляции после каждого сохранения файла программа выводит информацию о проведенной обработке файлов:


    Развитие проекта и планы на будущее


    Проект Prepros совсем молодой: первый релиз датирован 01 мая 2013 года, и, несмотря на то, что сейчас приложение производит впечатление уже готового продукта, приложение активно развивается, список запланированных фич можно посмотреть на главной странице проекта на GitHub.
    Поделиться публикацией

    Похожие публикации

    Комментарии 23

      +5
      Это некий grunt, только c GUI?

      приложение не зависит от того, установлены ли в системе соответствующие программы и библиотеки (sass, compass и т.п);

      То есть в него вшит компилятор? Что с автообновлениями в таком случае?
        0
        Ну не совсем уж не зависит, если я не ошибаюсь: github.com/sbspk/Prepros/blob/master/build/osx/build.sh#L54
          0
          Это некий grunt, только c GUI?

          Да, по сути.

          Обновления библиотек производятся авторами проекта; насколько я понимаю, программа обновляется автоматически при наличии доступа к интернету.
          О соответствующих обновлениях авторы приложения пишут в changelog'е.
            +1
            Строго говоря программа обновляется не автоматически, она лишь уведомляет пользователя о наличии новой версии. А вообще программа супер — пользуюсь ей уже с месяц, всем радует. Обновления выходят очень часто.
            +1
            Это некий grunt, только c GUI?

            Grunt во многом превосходит этот инструмент. Наличие большого количества плагинов и возможности редактировать сценарии в Grunt — это один из аргументов, а на самом деле Grunt кода более мощная вещь нежели любой из существующих на сегодняшний день инструментов для препроцессинга с GUI, даже славный Code Kit отдыхает.
            +2
            Стоит заметить, что это приложение написано на node-webkit.
              0
              Русские имена в пути проекта не понимает
                +1
                Эххх Линукс обделили :(
                  +2
                  На линуксе нужно писать Gruntfile а не в gui тыкать, а иначе почему вы еще не линуксе.

                  А вообще конечно бы лучше бы какой-нибудь gui конфигуратор для grunt написали бы, для тех кто конфигурирование не осилил, тк совсем недавно подобный вопрос возник, после дискуссии о внедрении grunt в frontend разработку.
                    0
                    Я оценил троллинг, но хочу всё-таки сказать, что такой троллинг некоторые принимают за чистую монету и начинают пугаться линукса.
                    0
                    Эсть альтернатива, она работает под linux koala-app

                    Они обе сделаны на node-webkit, по идее она должна работать под linux, но видимо не доведена.
                    +2
                    Проект интересный, но не имеет гибкости в настройке, как у Grunt. Возможность написания расширений под Prepros на данный момент абсолютно нет и под такое GUI решение вряд ли появятся. Поддержка файлов конфигурации также отсутствует.

                    Для полноценной сборки Front-End проектов на данный момент не пригоден, но является годной бесплатной альтернативой CodeKit.
                      0
                      Кстати, можно еще посмотреть Fire.app, вообще он стоит 14$, но можно самому собрать из исходников.
                      0
                      Не очень понятен принцип работы с ним. Оно локально на дев-машине работает или прямо на продакшене? В фоне изменения отслеживает или после каждого сэйва/коммита-чекаута исходников нужно его запускать?
                        0
                        Работает локально, можно включить автокомпиляцию файлов, тогда изменения будут отслеживаться автоматически.
                          0
                          Ас командной строки запускать, без гуевины, есть возможность?
                        +1
                        проще зацепиться за grunt, да и универсальнее.
                          0
                          объединять в один JavaScript-файлы

                          Не нашёл как объединять, в настройках нет.
                            0
                            В документации на сайте нужно смотреть, там в итоговом файле нужно дописать инструкции импорта.
                            +1
                            Пользуюсь для CoffeeScript, Jade, Stylus
                            Обновляется мануально, но мигает иконочкой при наличии новой версии.
                            Собственно у нее с собой Ruby и NodeJS
                            Обновления прилетают с обновлением версии программы.

                            Вообщем я так играясь поднял уже 2 мелких проекта и очень благодарен авторам Prepros.
                            Хотя по идее я CoffeeScript Jade и Stylus только ради эксперимента трогал, но мне нравится. Хочется еще и еще.
                            Удобно то что по нажатии на сохранение в редакторе сразу же видишь нет ли синтаксических ошибок.

                            Prepros немного тормозной, но это меня не останавливает.
                            0
                            Лучшая лучшая замена CodeKit на Windows.
                            • НЛО прилетело и опубликовало эту надпись здесь

                              Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                              Самое читаемое