MyTetra Share
Делитесь знаниями!
Настройка Sublime Text 3 для веб-разработки: LiveReload, плагины, фишки
24.03.2019
18:08
Автор: lensav
Текстовые метки: httm, sublime, text,3
Раздел: MyTetra - INTERNET - SUBLIME_TEXT3


Настройка Sublime Text 3 для веб-разработки: LiveReload, плагины, фишки

Сегодня мы рассмотрим настройку популярного редактора кода Sublime Text 3 для веб-разработки.

Поделиться
 
Твитнуть
 
Поделиться2
 
Класснуть
 
Плюсануть
 
Запинить
Внимание! Вышла более новая версия руководства. 
С новым материалом вы можете ознакомиться Здесь.

Плагины

emmet - плагин для скоростной верстки.

livereload - автообновление страницы.

Для корректной работы плагина LiveReload в Sublime Text 3 необходимо дописать в пользовательских настройках плагина следующую конструкцию (подробнее в видео):

  • code
  • source

  1. {

  2. "enabled_plugins": [

  3. "SimpleReloadPlugin",

  4. "SimpleRefresh"

  5. ]

  6. }


sass - настроим корректную подсветку SASS в Sublime Text 3.

jade - HTML препроцессор.

gist - плагин для быстрого доступа к вашим сниппетам на GitHub.

brackethighlighter - подсветка скобок, тегов в Sublime Text 3.

autofilename - автокомплит для подключения внешних файлов в верстку.

colorhighlighter - подсветка цвета.

BufferScroll - сохранение позиции курсора в документе.

Goto-CSS-Declaration - плагин для быстрого поиска соответствующего класса в CSS, SASS, LESS.

Фишки

  • Поменяем тему на twilight.
  • Научимся множественному выделению.
  • Назначим клавиши для события reindent (хоткей для автоматического формата документа).
  • Научимся управлять числовыми значениями (Инкремент и Декремент).

Ссылки

Sublime Text 3: http://www.sublimetext.com/3

Sublime Text 3 Package Control: https://packagecontrol.io/installation#st3

LiveReload Browser Extension: http://livereload.com/extensions/

Sublime Text 3 Live Reload Plugin: https://packagecontrol.io/packages/LiveReload

Премиум уроки от WebDesign Master:

 
MyTetra Share v.0.52
Яндекс индекс цитирования