Пишем CSS быстрее — Hayaky

Sublime Text — замечательный редактор кода. Мне он нравиться тем что в нем есть все современные фишки, которые ускоряют работу при написании кода. Только я привык к zen-coding, как обнаружил новую фишку — Hayaku.
Hayaku — это плагин для Sublimetext который позволяет более быстро писать css код. Работает он на основе нечеткого поиска. Например чтобы написать «font-size=14px» достаточно набрать «fz14». Использование вот таких вот сокращений позволяет повысить скорость работы.
Установка
Preferences → Package Control (CTRL+SHIFT+P) → Install Package → Hayaku
Перезапускаем Sublime Text 2.
Использование
Идея Хаяку во многом именно в том, что, как таковых, сокращений нет. Есть набор алгоритмов, разбирающих аббревиатуры и подбирщих наиболее подходящую пару свойство-значение из словаря.
Благодаря нечёткой структуре, всегда можно попробовать найти такую аббревиатуру, которая попадёт под алгоритм. Это быстрее, чем добавление новой статичной аббревиатуры в настройки и лучше запоминается — ведь ты сам экспериментируешь и находишь нужную работающую аббревиатуру.
Возможности
Нечеткие аббревиатуры CSS свойств
Если вы работали с Sublime Text 2, то наверняка знакомы с его функцией нечеткого поиска. Здесь реализовано примерно то же самое, но для CSS. Напечатав wi
, а потом нажав TAB
, вы получите width
. Тот же самый результат будет, если вы напечатаете wid
или wdt
— это же нечеткий поиск 🙂 Для большинства свойств сокращения весьма короткие, и состоят из пары букв, но вы можете напечатать столько букв из названия свойства, столько хотите, Hayaku справится.
Иногда вам может показаться, что Hayaku не совсем правильно расшифровывает ваши аббревиатуры, например, b
превращается в bottom
, а не background
или border
, это происходит потому, что свойства left, right, top, bottom
имеют наивысший приоритет.
Подробную статью про Hayaku и его применении лучше прочитать на хабре.
Приведу список сокращений котрыми я выбрал для себя и начал использовать:
bgig bgrt bgpt w1250 h100 ha = height auto db = display block fll = float left fz = font-size lh = liine-height fw = font-weight fz14 = font-size:14px; lh = lineheight
Вот так просто. Теперь я использую Less css, Hayku и Zen-coding. И всё балгодаря Sublime Text.
UPD 07.09.2013
Проблема с less в Hayaku в Sublime text 2
Установил заново Sublime и Hayaku и заметил что при работе с Less Hayaku перестал по сочетанию Ctrl + Enter создавать блок для кода { }. И также теперь в less вместо быстрых свойств — мне начали выдаваться какие-то сниппеты. В общем hayaku в нем работать перестал. А ведь это было очень удобно. Чтобы исправить это нужно добвать поддержку расширения .less в hayaku. Делаем следующее.
Идем в C:UsersИмя_вашего_пользователяAppDataRoamingSublime Text 2PackagesHayaku — tools for writing CSS fastercontexts.py
В contexts.py на 29-й и на 97-й строке дописываем расширение «source.less».
Выглядеть это будет вот так: