Komodo Edit и Zen Coding в Ubuntu

  •   26.07.2011
  •   48 комментариев
  •   Кодинг

Есть на свете замечательный редактор, который очень хорошо подходит для работы веб-девелоперов. Называется он «Komodo Edit». И есть не менее замечательная концепция создания кода под названием «Zen Coding», которая позволяет на порядки ускорить работу с HTML и CSS кодом. О том, как установить Komodo Edit в Ubuntu и настроить его для работы в режиме Zen Coding, я и расскажу в этой статье.

Komodo Edit и Zen Coding в Ubuntu

Перед тем, как начать, скажу пару хвалебных слов про Komodo Edit. Это первый редактор под Linux, в котором я увидел полноценное автодополнение HTML-тегов и их атрибутов. И это первый редактор, который можно назвать достойным аналогом Adobe Dreamweaver в Linux.

К сожалению, в репозиториях Ubuntu редактор Komodo Edit отсутствует. Отсутствует и PPA на Launchpad, с которого его можно было бы установить. Также не получится скачать на оф. сайте deb-пакет, здесь предлагают к скачиванию только tar.gz-архив. И тем не менее, есть способ установить Komodo Edit в Ubuntu стандартным способом, а недавно даже появился неофициальный репозиторий, из которого это можно сделать.

Update (июль 2017)

Нижеописанные (скрытые под спойлер) инструкции давно не актуальны, но зато доступен (правда, уже не обновляется) PPA:

sudo add-apt-repository ppa:mystic-mirage/komodo-edit
sudo apt-get update
sudo apt-get install komodo-edit

Началось все с того, один хороший человек на официальном форуме компании ActiveState выложил скрипт, при помощи которого можно конвертировать tar.gz-архив с официального сайта в deb-пакет для установки в Debian или Ubuntu. А немного позже еще один хороший человек (зовут его Андрей Аносов) не только собрал и выложил deb-пакет для 32- и 64-битных архитектур, но и создал deb-репозиторий, благодаря которому установка Komodo Edit в Ubuntu упростилась до предела.

Итак, первым делом перед прописыванием нового репозитория пропишите для него публичный ключ:

sudo apt-key adv --recv-keys --keyserver keyserver.ubuntu.com 8B9E0439

После этого пропишите сам репозиторий, добавив в «/etc/apt/sources.list» одну из следующих строк (в зависимости от версии вашего дистрибутива Ubuntu):

deb http://deb.anosov.org.ru natty non-free
deb http://deb.anosov.org.ru maverick non-free
deb http://deb.anosov.org.ru lucid non-free

Теперь осталось только обновить список источников и установить Komodo Edit:

sudo apt-get update
sudo apt-get install komodo-edit

Вот и все, Komodo Edit установлен, причем самым корректным способом.
Теперь добавим в него возможность работы по принципам Zen Coding. Для этого достаточно перейти на пункт меню «Tools → Add-ons», после чего найти и установить расширение «Zen Coding». Как видите, здесь тоже все просто.

Update (июль 2017)

Со времени написания этой статьи много воды утекло. «Zen Coding» теперь называется «Emmet», а расширение для «Komodo IDE» сейчас находится по другому адресу. Остаток статьи оставил без изменений, поскольку я давно отказался от использования Komodo в пользу «Sublime Text».

Только вот по умолчанию для работы с Zen Coding не назначены горячие клавиши. Исправим это недоразумение. Для этого нужно открыть диалог «Edit → Preferences…», выбрать в нем раздел «Editor → Key Bindings» и отфильтровать нужные нам пункты, введя в поле «Commands» фразу «Zen Coding». Теперь для каждого из отображенных пунктов можно назначить горячие клавиши. Чтобы не выдумывать ничего нового, я использовал готовые хоткеи, которые назначены в расширении для Dreamweaver:

Expand Abbreviation             Tab or Ctrl+,
                                (on selection only Ctrl+,)
Wrap with Abbreviation          Ctrl+H
Re_flect CSS Value              Ctrl+R

Balance Tag Outward             Alt+[
Balance Tag Inward              Alt+]
Next Edit Point                 Ctrl+Alt+Right
Previous Edit Point             Ctrl+Alt+Left
Go to Matching Pair             Alt+/
Select Next Item                Alt+Right
Select Previous Item            Alt+Left

Insert Formatted Newline        Ctrl+Enter
Select Line                     Ctrl+K
Merge Lines                     Ctrl+\
Toggle Comment                  Ctrl+/
Split/Join Tag                  Ctrl+Shift+\
Rename Tag                      Ctrl+Shift+B
Remove Tag                      Alt+-
Evaluate Math Expression        Alt+=

Increment number by 1           Ctrl+Up
Decrement number by 1           Ctrl+Down
Increment number by 10          Ctrl+Alt+Up
Decrement number by 10          Ctrl+Alt+Down
Increment number by 0.1         Alt+Up
Decrement number by 0.1         Alt+Down

Часть из этих хоткеев оказалась уже занятой, но я этим пренебрег, поскольку они были закреплены за не самыми ходовыми операциями. Правда некоторые хоткеи я все же изменил, например, назначил для действия «Expand Abbreviation» комбинацию Alt+Enter, для действия «Reflect CSS Value» комбинацию Ctrl+Shift+R, а для действия «Wrap with Abbreviation» комбинацию Ctrl+Alt+Enter. Но это уже детали.

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

Есть вопросы или дополнения по теме? Пишите в комментарии.


Оставить комментарий

48 комментариев на «“Komodo Edit и Zen Coding в Ubuntu”»

    • За репозиторий спасибо не мне, а Андрею Аносову 🙂
      Кстати говоря, Komodo Edit недавно обновился, и Андрей практически сразу обновил версию в репозитории, за что ему еще раз спасибо.

      • А какие плагины пользуете для Комодо? Меня больше интересует вёрстка и что-то работа с цсс меня не впечатлила ((

        Жаль, что он не показывает цвета в css, при наведении на коде #. Очень удобно, когда лезешь в чужой шаблон или в свой старый 🙂

        Да и саму палитру цветов я в нём пока не нашёл. Не очень удобно для таких простых вещей ещё что-то стороннее использовать. Вы что используете?

        По остальному пока не могу сказать, толком ещё не тестил. Но в целом, вроде бы, ничего. С некоторыми недостатками можно мириться.

        • Извиняюсь, посмешил про цвета )) Гугл рулит )) Хотя, я и до вопроса искал, но тут попалось. Ctrl )) Всё, я доволен Комодой более чем полностью! Уже можно работать 🙂 А к остальному привыкну быстро.

    • Пожалуйста, vovans!
      Кстати, в связи с выходом Ubuntu 11.10 можно добавлять репозиторий строчкой deb deb.anosov.org.ru oneiric non-free. Хотя особой разницы нет. Пакеты для разных версий Ubuntu все равно одинаковые.

  1. Очень жаль, что не наткнулся на Ваш ресурс раньше! Пришлось ручками ставить, помучился немного, но вот… Я счастливый пользователь достойной замены notepad++. Единственно… проблемка с английским… никто еще не перевел этот редактор на русский?

    • А для чего там русский? Что именно там может быть не понятно?

      И как Komodo может заменить notepad++ в убунте? о_0

      • Для тех, кто с английским на ты – конечно понятно все, а вот у меня с ним проблемка… учил всю свою жизнь немецкий… так что волей-неволей а трудности встречаются… хотя бы с настройкой.
        А notepada в ubunte вроде вообще нет, просто я пользовался им для написания и редактирования html страниц через ftp. Komodo такое позволяет, подсветка есть и все такое, вот я и сказал, что это ДОСТОЙНАЯ замена. Чего не понятно то?

        • То непоятно, что вы благодарите за руководство по установке Комодо в Убунте, а потом говорите, что Комодо стал достойной заменой блокнота. Но как такое могло произойти, если этого notepad++ вообще нет в Убунте? Какая же это замена?

          И английский я сам неважно знаю, но с использованием Komodo Edit проблем нет. Всё так же как и у всех.

          • Для непонятливых… Я всю жизнь проработал на windows и лучшего редактора чем notepad++ я там не встретил. Сейчас я работаю в Ubuntu, но поскольку такого редактора я до этого времени не встречал, то пользовался notepad++ под wine. Теперь понятно? А сейчас наткнулся на komodo и очень рад этому! По своему функционалу он нисколько не уступает блокноту. А про английский… я тоже пользуюсь и им без проблем, просто не могу его настроить так как мне бы хотелось. Например в нотепаде есть такая фишка-как подсветка не только парных скобок, но и парных тэгов в html. В komodo такая функция тоже реализована, но не так… она динамическая, т.е. при нажатии на открывающий тэг, закрывающий подсвечивается кратковременно, а хотелось бы постоянно. Настроек очень много и разобраться в них без знания английского очень трудно. Задавать множество вопросов не хочется… это всегда раздражает, поэтому и задал вопрос по русификации… потому, что уж в русском сам бы разобрался )))

          • Вынужден вас разочаровать, но не найдёте вы этого в настройках. Это, типа, фишка такая у Комодо. Я сделал так.
            Открыл файл prefs.xml, вбил в поиске showMatchingTags_clearInterval и добавил к значению по умолчанию (1000) несколько цифр. Думаю, что если все эти три строки:

            1
            1
            1111000

            внести в конфиг, что в домашней директории, то эффект будет тем же. Но не проверял.

            Неудобно, конечно. Но можно сделать раз и забыть надолго 🙂

          • ч0рт, обрезался весь код, что я приводил. Ну да ладно, в файле настроек и так всё предельно понятно, что да куда.

          • Благодарю! Отчасти помогло)))
            Почему отчасти: я увеличил значение времени подсветки, все вроде стало в норму, первые две строки отвечают за включение этой функции, поэтому менять их не нужно)))
            Теперь осталось еще десятка 2 привычных для меня настроек…. Поэтому отчасти… В любом случае огромное спасибо. Жаль что из двух парных тэгов подсвечивается только один (( не удобно, если эти парные тэги не вмещаются на один экран….

          • Вообще, чувствую, что надо уже заметку у себя делать со всеми тонкостями, которые были обнаружены при работе с Комодо ))

            А то через пол года уже и не вспомнишь, что куда.

    • Русификатора или чего-то подобного не видел, хотя я его и не искал (использую англоязычный интерфейс во всех приложениях).

    • Да, вот кстати, интересны впечатления 🙂
      У меня процесс протекал наоборот – сначала Komodo, потом Netbeans, и последний меня очень порадовал.

          • Да я собственно так просто спросил. В Vim возможно больше шума чем удобства. Но скорость работы в консоли пугает 🙂

          • Вы Sublime пробовали?
            Если нет, попробуйте — скорость работы приятно удивит 😉

          • Блин… Я захлебываюсь от удовольствия… Очень хочется, чтобы Sublime удовлетворил все мои требования… Скорость работы… Супер…

          • У меня было такое же первое впечатление. И дальнейшие ожидания тоже оправдались 🙂

      • Я с некоторых пор перешел на Sublime Text 2. Он очень легкий в плане нагрузки на систему, при этом на мой взгляд более функциональный и приятный в использовании, чем большинство «тяжелых» редакторов (типа тех же Komodo и Netbeans).

        • У меня компьютер хороший середнячек, поэтому вопрос ресурсов не стоит очень остро, поэтому между скоростью и удобством я выберу последнее.
          В Netbeans мне очень понравилась организация проектов, а также возможность выгрузки изменений сразу на хост прямо IDE, т.е. минус Filezilla. Это конечно не всегда нужно, но конкретно сейчас это свойство мне очень пригодилось.
          Немного огорчает отрисовка Netbeans в Unity, тот же Komodo выглядит приятнее, но в то же время Netbeans вполне няшно выглядит в KDE.
          Собственно я к чему 🙂 Если Sublime Text 2 не уступает по удобству Netbeans, тогда можно пробовать 🙂

          • Дело не только в ресурсах. Тяжелые Java-приложения работают с определенной задержкой даже на самых современных и мощных компьютерах. А вот с Sublime я понял наконец-то, что такое моментальный отклик, и возвращаться на другие редакторы желания нет. И организация проектов в Sublime — прекрасна 🙂
            И насчет удобства и няшности — Sublime — очень удобная няшка… 🙂
            Попробовать очень советую.

  2. Подскажите пожалуйста, вы не сталкивались с такой проблемой:
    Работаю в KUbuntu, после обновления дистрибутива до 11.10 и, соответственно, переустановки Komodo Edit (6.1.3) обнаружился трабл – не видно текста во всплывающих подсказках по коду.
    Сам текст присутствует, так как если в середине набора нажать Enter, то дополняется нормально, но его не видно. Гугл вывел только на одно похожее упоминание проблемы, но там у товарищей, судя по всему, Gnome, так как у меня в Kubuntu таких файлов и близко нету…

    Вы не в курсе, как это исправить? Похоже проблема банально в совпадающих цветах фона и текста, но где это поменять – не могу найти…

    • У меня Ubuntu 11.10, Komodo Edit 6.1.3 — такой проблемы нет. Возможно, это что-то специфичное для KDE.

      Попробуйте поиграться с цветовыми схемами — если проблема действительно в совпадающих цветах, то это может помочь.

      • Благодарю за ответ, проблему уже нашёл. Действительно, специфична только для KDE, причём я описал только половину проблемы – оказывается тут ещё и диалог открытия файлов такой же “пустой”.
        Причина – в какой-то несовместимости Komodo с темой оформления Oxygen-GTK под “кедами”. Вылечилось установкой для GTK темы QtCurve.
        В ActiveState об этом баге знают, но пока побороть его не могут.

  3. Нигде не могу найти ярлык для запуска, запуск через терминал выдаёт такую ошибку:
    (komodo-bin:3017): Gtk-WARNING **: Загружаемый модуль тем не найден в module_path: «pixmap»
    У меня ubuntu 11.10, как можно решить эту проблему?

    • Виталя, попробуйте установить пакет gtk2-engines-pi xbuf (в терминале – apt-get install gtk2-engines-pi xbuf).
      А ярлыки в меню у меня тоже не создавались, я делал вручную. Если работаете в KDE – не забывайте ставить галочку “показывать только в KDE” у пункта меню, иначе он совсем из меню пропадёт (глюк такой есть…)

      • Ввёл, выдал такое:
        ~$ apt-get install gtk2-engines-pixbuf
        E: Не удалось открыть файл блокировки /var/lib/dpkg/lock – open (13: Отказано в доступе)
        E: Не удалось выполнить блокировку управляющего каталога (/var/lib/dpkg/); у вас есть права суперпользователя?

        • Установку пакетов необходимо производить от имени суперпользователя (root). То есть:

          sudo apt-get install gtk2-engines-pi xbuf
  4. Теперь осталось только обновить список источников и установить Komodo Edit

    Как это сделать??? Ввожу в терминале, результат: command not found

    Если у меня ubuntu 11.10, то какую строку добавить в /etc/apt/sources.list?

    Третий день на ubuntu, до этого виндой пользовался. Flash нормально не работает, дров на ati mobility radeon hd 5650 нормальных не найти, второй монитор в режиме не клона не подключить. Это все решается, но если ты в глаза не видел ubuntu до этого, то это целый головняк.

    Пока писал это, скачал deb пакет и установил Komodo Edit.
    Хотелось бы понять и этот способ!!!

  5. Добрый вечер. Я не так давно занимаюсь версткой. Немного не понятно с последним пунктом. Подскажите, какие именно действия сделать, чтобы назначить эти горячие клавиши.

    • С удовольствием вам помог бы, но не знаю — чем.
      Вроде как действия по назначению клавиш итак разжеваны в статье максимально подробно.
      Что именно непонятно?

    • Все вышеперечисленное понятно. Не ясно какие действия необходимо сделать далее. Выделяю Commands: Zen Coding. Выбираю из списка например .Balance: Tag Inward. Ввожу в поле Nev Key Sequence : Alt+], в итоге раскладка не назначается.

      • Сказать по правде — сейчас я Komodo Edit не использую (соответственно он у меня не установлен), потому в деталях ответить на этот вопрос не могу.

      • Очень жаль, в гугле сплошные гс, только в вашем блоге есть подробное описание этой темы. Пишите еще, читать ваш блог интересно.

  6. А где у него шрифт редактора устанавливается?
    Собственно проблема в чём…
    Сейчас у меня KomodoEdit установлен, но не из рэпов. Хочу снести и поставить из рэпов. Но, в текущей версии установил классный шрифт, и забыл как ставил. Хотел бы узнать название, снести редактор, установить из рэпов и поставить этот же шрифт.
    Вопрос 1. Как узнать шрифт?
    Вопрос 2. Как снести редактор, который ставился как sh ./binfile?

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *