Как установить плагины на sublime text 3. Лучшие плагины для Sublime Text. Тонкая настройка редактора, пресет моих настроек

Сегодня я решил перейти со старого сублайма на Sublime Text 3. В этом посте я хочу зафиксировать список используемых мной плагинов и заодно расскажу немного о них. Например о таких, которые делают клевую подсветку значений цвета:)

Для удобной установки плагинов необходимо поставить Package Control. Для этого открываем консоль в редакторе(Ctrl + `) и вводим следующую команду:

Import urllib.request,os,hashlib; h = "eb2297e1a458f27d836c04bb0cbaf282" + "d0e7a3098092775ccb37ca9d6b2e4b7d"; 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)

После чего перезапускаем редактор. Хочу заметить что новая версия запускается еще быстрее старой. Теперь для установки плагинов нажимаем Ctrl + Shift + P и выбираем Package Control: Install Package . Там выбираем плагин и жмем Enter.

Плагины

Emmet

Думаю в представлении не нуждается. Это плагин для быстрого набора html и css-кода.

Local History

Удобный плагин для просмотра истории изменения файлов.

Encoding Helper

Отображает в статусной строке кодировку файла, а также позволяет открывать и сохранять файлы в различных кодировках.

SublimeCodeIntel

Умный автокомплит, имеется возможность перепрыгивать к definitions при помощи Alt + Click.

SublimeREPL

Интерпретатор различных языков. Например Python, NodeJS и другие

DocBlockr

Удобная вставка JSDocs, парсит параметры функций. Введите перед функцией /** и нажмите Tab .

Очень крутой автокомплит имен файлов. Можно использовать в любых атрибутах, любых тегов. Для картинок еще и показывает ширину и высоту изображения.

ColorHighlighter + GutterColor

Подсветка цветовых значений в css. Color Highliter подчеркивает сами значения цвета. А благодаря GutterColor — слева появляются кружочки с цветом(требуется установленный ImageMagick).
Колор пикер — работает по хоткею Ctrl + Shift + C.

Plain Tasks

Трекер для задач. Простенький todo-лист с красивым оформлением. Сохраняется все в текстовом формате.

MarkdownEditing

Удобное редактирование markdown-файлов, например для гитхаба.

Sidebar Enhancements

Улучшенный сайдбар.

ApplySyntax

Автоматический детектор типа файла.

SublimeGit

Полнофункциональная интеграция GIT

SidebarGit

Контексное меню GIT в сайдбаре редактора. Подойдет для тех, кто не сильно любит коммандную строку.

GitGutter

Диффы для гита. Показывает слева изменения с последнего коммита.

HTML-CSS-JS Prettify

Форматирование кода. необходим node.js. Хоткей Ctrl + Shift + H.

Inc-Dec-Value

Увеличивает\уменьшает числовые значения по Alt + стрелка вверх/вниз. Как в фаербаге или в хром девелопер тулз.

EasyMotion

Быстрое перемещение по тексту. Для любителей Vintage Mode да и не только для них, рекомендуется.

AdvancedNewFile

Быстрое создание файла. Ctrl + Alt + N. Если вы пользуетесь Evernote — то будет открывать новую запись в Evernote — не забудьте поменять хоткеи.

K

Добрый день, всем! Я попытался собрать лучшие плагины Sublime Text, который действительно позволяет улучшить рабочий процесс. Я искал много сайтов, и вот что я сделал.

WebInspector

Удивительный инструмент для debagging наличие полноценного инспектора кода для Sublime. Особенности: точки останова для реализации проекта, сохраненного в пользовательских настройках с абсолютными путями, консоль, Отладчик и останова, трассировки стека. Все это работает на ура! А еще есть Fireplay от Mozilla, который позволяет подключаться к Firefox Инструменты разработчика и простейшей debagger JSHint .

Муравей

Один из самых популярных плагинов для редакторов. Эммет, бывший Zen Coding также является одним из наиболее эффективных методов повышения производительности веб-разработчиков. После нажатия на клавишу Tab Эммет преобразует простую сокращение в объеме фрагментов кода для HTML и CSS. Кроме того, я хочу отметить,Hayaku - коллекция удобного сокращения для каскадных таблиц стилей.

Git

Суть этого плагина ясно из названия - возможность работать с Git непосредственно в вашем любимом редакторе. Этот способ работы с Git позволит вам сэкономить много времени. Во-первых: вам не придется постоянно переключаться между Sublime и терминала. Во-вторых: есть хороший тег автозаполнения, и вместо того, мерзавца добавить-A , то достаточно написать добавить . В-третьих: есть такие вещи, как быстро, совершившие, ведьма один быстрый команда добавляет все изменения и зафиксировать их.

Если с Git вам нужно всего лишь возможность содержания взять из удаленных репозиториев, то я рекомендую Nettuts + Fetch .

Классический autocomple в Sublime Text работает только с текущего файла.AllAutocomplete поиск во всех открытых файлов в текущем окне, что значительно упрощает процесс разработки. Также есть CodeIntel , который воплощает в себе черты IDE и приносит "Код Intelligence" для ряда языков: JavaScript, каменщик, XBL, XUL, RHTML, СКС, Python, HTML, Ruby, python3, XML Сасс, XSLT , Django, HTML5, Perl, CSS, Twig, меньше, Smarty, Node.js, Tcl, TemplateToolkit, PHP.

Возможно, одним из самых полезных плагинов для разработчиков. SublimeREPL непосредственно в редакторе запустить интерпретатор для всей серии языках: Clojure, CoffeeScript, F #, Groovy, Haskell, Lua, MozRepl, NodeJS, Python, R, Ruby, Scala, оболочки.

DocBlockr станет для вас эффективным инструментом для документирования кода.После ввода / ** и нажатия клавиши Tab, плагин будет автоматически анализировать любую функцию и подготовит соответствующий шаблон.

Потрясающе расширение для SublimeText, Vim, Emacs, IntelliJ IDEA, который позволяет разработчикам совместно работать над кодом, и из разных редакторов.

Автозаполнение путь к файлам - это очень удобно. Без лишних слов.

Обычно, когда мы должны цветовую палитру мы привыкли использовать Photoshop или Gimp. Но полное выбора цвета могут быть доступны непосредственно в редакторе - Ctrl / Cmd + Shift + C И ты замечательно. GutterColor и ColorHighlighter , которые упрощают ориентацию в цветовых кодов:

Выделяет все переменные, что существенно упрощает ориентацию в коде. Особенно полезен для разработчиков с дислексией.

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

Может быть, лучше плагин для работы с Markdown: подсветка синтаксиса, сокращений, авто, цветовых схем и т.д. В качестве альтернативного решения, вы можете попробовать MarkdownPreview .

В конце концов

• Sublime SFTP
• CTags - CTags поддержка FO Sublime.
• SideBarEnhancement - множество дополнительных возможностей контекстного меню в боковой панели.
• ActualVim - Вим в Sublime - два любимых редакторов в одном.
• SublimeLinter - Встроенный нибудь вкусненькое подсветка для C / C ++, Java, Python, PHP, JS, HTML, CSS, и т.д.
• CSScomb - CSS стиль кодирования форматирования.
• FixMyJS , Jsfmt и JsFormat - JS / JSON форматтеры стиль кодирования.
• AStyleFormatter - C / C ++ / C # / Java кодирования форматирования стиля.
• SVG-фрагменты - набор пользовательских фрагменты SVG.
• Inc-Dec-Value - увеличение / уменьшение числа, даты, цвет шестнадцатеричные значения, и т.д.

Правильный набор плагинов может повысить эффективность работы в любом приложении. Если вы являетесь веб-разработчиком, работающим с Sublime Text 3 Package Ccontrol , мы настоятельно рекомендуем внимательно ознакомиться с рассмотренными в этой статье плагинами:

• Package Control ;
• HTMLPrettify ;
• Emmet ;
• Bracket Highlighter ;
• jQuery ;
• Case Conversion .

Package Control

Это плагин позволяет легко находить, устанавливать и обновлять другие пакеты. Его нужно установить первым. Это упростит работу со всеми другими плагинами.

Как установить

1. Перейдите по ссылке https://packagecontrol.io/installation и скопируйте команду, которая будет выглядеть примерно так:

1. Нажмите Ctrl — обратный апостроф (; `), чтобы открыть Sublime Text Console :

1. Вставьте команду и нажмите Enter .

1. После запуска команды вы увидите небольшое всплывающее окно с предупреждением:

1. Нажмите «ОК ».
2. Закройте и перезапустите Sublime Text .
3. Введите команду Package Control , чтобы просмотреть все команды:

Мы будем использовать Package Control Sublime Text для остальных плагинов.

HTMLPrettify

Принимает длинные строки HTML , CSS , JavaScript и JSON и форматирует их так, чтобы вы могли их прочитать, а не пытались разобраться в сплошном наборе текста.

Как установить

1. Нажмите Ctrl-Shift-P в Windows , чтобы открыть «Панель команд ».
2. Введите команду Package Control , чтобы просмотреть все команды. Выберите Package Control: Install Package . На экране появится меню доступных плагинов:

1. Введите HTMLPrettify :

1. Нажмите на HTML-CSS-JS Prettify . Данное название немного отличается, но это тот же плагин.

Emmet

Это плагин раньше назывался Zen Coding . Он позволяет писать сокращенные коды HTML и CSS . Например, набрав следующее:

#page>div.logo+ul#navigation>li*5>a{Item $}

И нажав клавишу tab , вы получите:

После установки Emmet с помощью Sublime Text Package Control перезапустите Sublime Text .

Чтобы Emmet работал, необходимо установить синтаксис для документа. Иначе он работать не будет:

Теперь проверьте. Введите следующее:

nav#menuSystem.navMenu.isOpen>div#hotelLogo>div.navMenuIcon.logoIcon+div#arrowPointer+ul#navMenuMain>li.navMenuItem.navMenuItem$$$*2>div.navMenuIcon{Item $}+a{Item $}

И нажмите tab . Вы получите:

Чтобы изучить все доступные сокращения, уйдет много времени. Это позволит писать HTML-код намного быстрее.

BracketHighlighter

Плагин подсвечивает скобки и теги. После установки с помощью Sublime Text Package Control install можно щелкнуть в любом месте JavaScript или HTML-кода , и увидеть в левом столбце открытие и закрытие скобок:

JQuery

Плагин jQuery подсвечивает корректный синтаксис методов jQuery и предоставляет фрагменты кода для его завершения:

Case Conversion

Позволяет переключаться между snake_case , camelCase , PascalCase и т. д. После установки плагина с помощью Package Control (введите «pic » для быстрого доступа к Install Package ), попробуйте:

До: navMenu

Нажмите: ;;c, затем;;c

После: nav_menu

Обратите внимание, что это не будет работать должным образом, если вы попытаетесь преобразовать целую строку.

До: