Обзор текстового редактора Sublime Text 3

Всем привет! Сегодня хотелось бы рассказать об одном классном текстовом редакторе под названием Sublime Text 3. До этого я пользовался легковесным Notepad++ для различных конфигов и кодинга, но сейчас немного увлёкся веб-разработкой, как уже можно было понять в одной из предыдущих статей.

Смотрел видеоуроки и обратил внимание на отсылки к текстовому редактору Sublime Text 3 (далее – ST), возможности которого слегка поражали. О некоторых из них попробую рассказать здесь, но опять же, это надо видеть или делать своими руками. При желании в YouTube можно найти множество роликов, повествующих о его богатых возможностях (и демонстрирующих всё их многообразие), я не буду создавать ещё один, а постараюсь вкратце описать то, что мне понравилось.

Быстрый доступ к настройкам

Чтобы не бегать по меню (которое достаточно многообразно) в поисках нужной команды, можно нажать сочетание клавиш Ctrl+Shift+P и начать набирать то, что мы хотим сделать.

Впоследствии, когда будете ставить дополнительные сниппеты (о них далее), плагины и т.д., то этот список будет расширяться новыми пунктами (кстати, если открывать разные типы файлов – тоже список может меняться), поэтому искать что-то таким способом станет легче. Кстати, здесь же показываются горячие клавиши, если они есть (а если нет, то их можно назначить).

В примере на скриншоте я привёл команду сортировки линий. Работает изумительно! Выделяем ряд строк, нажимаем F9 и вжух-вжух! Строки отсортированы в алфавитном порядке!

Быстрое выделение текста

Множество вариантов выделить определённый фрагмент текста, например то, что заключено внутри скобок – Ctrl+Shift+M. Пригодится в программировании, например. Ставим курсор в любое место внутри скобок и нажимаем заветное сочетание клавиш! Редактор выделит текст по обе стороны от курсора до ближайшей пары скобок.

Если же речь идёт о HTML/XML коде, то выделит содержимое какого-либо тега можно нажатием клавиш Ctrl+Shift+A – выделится только текст внутри конкретного тега. Это очень удобно, если имеется большая вложенность, а инденты (отступы) расставлены не очень красиво.

Кстати, об отступах. Мало того, что они здесь гибко настраиваются, так ещё и есть возможность выделить весь текст на определённом уровне отступов. Для этого нужно запомнить сочетание клавиш Ctrl+Shift+J. Запомнить такое количество клавиш сразу тяжело, но стоит попрактиковать это пару часов в работе и всё!

Кстати, можно выделив какой-то фрагмент текста быстро выделить и другие вхождения этого же фрагмента в тексте нажав Ctrl+D, причём тут мы сталкиваемся с таким понятием, как множественное выделение и редактирование. Теперь в тексте у нас несколько курсоров! Можно вводить и удалять текст одновременно в несколько мест! Этот способ хорош для переименования класса или переменной или перепечатки какого-либо участка текста, если использование поиска и замены нежелательно!

Плагины

Плагинов великое множество! А так как редактор, насколько я знаю, написан на Python, то и писать какие-то свои дополнения под силу каждому, кто знаком с языком.

Установка плагинов достаточно проста – в уже упомянутой мной панели быстрого доступа к настройкам вводим Install Packages и попадаем в панель дополнений, где так же действует поиск. Выбрав нужное дополнение жмём Enter и оно устанавливается! Нет ничего проще!

Плагинов великое множество! Есть и для встраивания терминала прямо в окно редактора, для работы с git, подсветки синтаксиса и ещё много чего ещё!

Сниппеты

Вот эта тема мне очень понравилась! Есть определённые заранее заготовленные “кирпичики”, которыми можно пользоваться для ускорения ввода текста. Кроме того, можно задавать собственные! Сейчас покажу.

Плагины

Ставим плагин Emmet, он помогает расширить количество сокращений удобных для вёрстки кода (вот список), переходим в редактор и напишем конструкцию вида:

.class1>ul>(li.MenuItem{Пункт $})*5

То есть класс, в который вложен ul, в который вложены li в количестве пяти штук, имеющие класс MenuItem с содержимым тега “Пункт ” и порядковый номер элемента.

Нажимаем Tab и конструкция развернётся в

Колдовство? Согласен!

По ссылке есть и правила, по которым преобразуются сниппеты. Там ОЧЕНЬ много материала, стоит брать на вооружение.

Собственные сниппеты

Мы также можем делать собственные сниппеты. Весьма несложно. Делается следующим образом:

  1. Tools -> Developer -> New Snippet
  2. Откроется новое окно с текстом вроде этого:
  3. Тут всё в принципе понятно, создаём конструкцию вида:
    Думаю понятно, что есть что. content – то, что будет вписано. tabTrigger – по какому сочетанию клавиш это вызывать. scope – область видимости, с какими типами файлов работать. Всё есть в документации.
    Я же сделал цикл for и описал там некоторую текстовую константу с тремя маркерами ввода, причём в пермое задано значение по умолчанию “0”. Символы $ тут являются служебными, и те, что относятся к тексту, приходится экранировать слешем.
  4. Сохраняем сниппет:
  5. Перезапускаем редактор, чтобы изменения вступили в силу… И пробуем! Открываем php-исходник и пишем там наше ключевое слово fori и жмём Tab:
    Сначала курсор у нас стоит в позиции с выделенным текстом 0 (это значение по умолчанию ${1:0}), при нажатии следующего Tab, он перейдёт в позицию ${2}, затем ${3}. Таким образом мы можем расставить якоря, куда прыгать курсору для ввода текста! Также есть много служебных ключевых слов и методик, позволяющих модифицировать тело сниппета на лету. Ну я так не углубляюсь, просто пишу часто употребляемые конструкции.

Сворачивать фрагменты файла

Можно убрать большую “простыню” кода, если выделить фрагмент и нажать Ctrl+Shift+[ (развернуть – соответственно Ctrl+Shift+] ).

Было

Стало:

Типовая функция, но весьма приятная.

Навигация по CSS-свойствам

Открываем CSS-файл и нажимаем клавиши Ctrl+R. Появится панель с полем ввода, где мы можем набрать какой-либо класс CSS, или просто перемещаться стрелочками между классами. В редакторе будет мгновенно подсвечиваться нужный участок кода:

Нечто подобное есть и для HTML кода, правда там навигация по ID идёт.

Разделение рабочей зоны на окна

Куда же без этого?! Есть множество предустановок, например Alt+Shift+1 (так же есть цифры 2, 3, 4, 5, 8, 9)

Интересно? Поделись с другом
Litl-Admin.ru

Comments:

Leave a Reply