12 декабря 2017

Emmet для Sublime text: установка

Emmet — плагин, ускоряющий написание HTML и CSS кода. Статья поможет установить плагин для Sublime text.

Emmet — плагин, ускоряющий написание HTML и CSS кода, за счёт сокращений. Например, в пустом документе достаточно поставить ! и нажать Tab, чтобы получить заготовку страницы с базовой разметкой.

Emmet в википедии

Emmet (ранее Zen Coding) — набор плагинов для текстовых редакторов, которые в некоторой степени ускоряют написание кода HTML, XML, XSL, а также кода на некоторых других языках. Проект был начат Вадимом Макеевым в 2008 году и активно разрабатывается Сергеем Чикуенком начиная с 2009 года, а также сообществом пользователей Zen Coding на основе идеи Zen Coding 2.0.

Emmet доступен для всех популярных текстовых редакторов, но эта заметка о том, как установить Emmet для Sublime text.

Установка Package Control для Sublime text

Прежде, чем ставить Emmet, нужно поставить «Package Control» — это менеджер плагинов для редактора Sublime text. С его помощью вы сможете ставить и другие плагины в пару кликов.

Нужно открыть поле ввода кода: View -> Show Console

Скопируйте код целиком и вставьте в текстовое поле, как указано на скриншоте ниже.

import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

В нижнее, маленькое поле ввода.

После чего нажнмите Enter и перегрузите редактор.

Теперь займёмся основным делом и установим таки Emmet.

Установка Emmet на Sublime text

После того, как поставили Package Control, запустим его:

Ctrl + Shift + P на Windows
Command + Shift + P на MacOS

В появившееся окно вбиваем «Package Control: Install Package» и выбираем нужный пункт. В окне работает автоподбор, так что всё целиком вбивать не обязательно. Смотрите скриншот.

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

Когда отобразилось следующее окно, вбиваем в строку поиска «Emmet». Выбираем первый пункт и кликаем в него.