node.js — Консоль Sublime Text 3
В обзоре могут содержаться субъективные суждения, основанные на опыте работы с плагинами для Sublime Text.
Протестировано на
Вообще в Sublime Text по моему вероятностному суждению примерно треть плагинов совсем не работают после установки. Но расписанные в обзоре лично у меня функционируют, что доказывается скринкастами.
По причине того, что использую Windows, не рассмотрены такие решения, как Tint и fish-shell. Если не упомянул что-то ещё, можете добавить.
Терминология
В данном обзоре встроенная консоль Windows называется «консолью» или «внешней консолью» в зависимости от контекста. Согласно автору программы ConEmu называть её cmd.exe
не совсем корректно:
В Windows есть встроенный терминал (или “консольное окно”) которое часто ошибочно называют “cmd.exe”. Нажмите Win+R и запустите, например, “powershell.exe”. Среди запущенных процессов не будет “cmd.exe”. В разных версиях Windows консольное окно создают разные процессы, в актуальных – это “conhost.exe”.
Не ‘cmd.exe’, а просто ‘консоль’!
1. SublimePTY
Страница плагина. Разработка давно прекращена.
Для Sublime Text пишут плагины, облегчающие запуск только отдельных команд только для определённых инструментов программирования. Например, команды Git проще запускать с помощью плагинов Git, SideBar Git и Easygit (Не загружайте Easygit через Package Control, он не будет работать! Установите плагин вручную по ссылке). Так как в вопросе указана метка
, приведу в пример плагин npm
.
1. npm
Плагин, благодаря которому можно запускать многие команды npm — пакетного менеджера Node.js.
1. Демонстрация
2. Недостатки
- Баги. Не запускается ряд команд.
Общая оценка
Все решения хорошие, пользуюсь ими, но полностью внешние терминалы они не заменяют.
1. Glue
1. Оценка
Использую иногда.
2. Демонстрация
3. Установка и настройка
Скачиваем плагин через Package Control →
- В открытом файле проекта Ctrl+Shift+P →
Glue - Launch
. - Или же кликаете правой кнопкой мыши по папке в сайдбаре, в выпадающем меню выбираете
.
Откроется quick panel, куда следует вводить команды:
Появится файл terminal.glue
. Без него никак, если мешает, можете добавить расширение glue в .gitignore
, .hgignore
или другой файл, который используется для игнорирования директорий/файлов в Вашей системе контроля версий.
Чтобы в выводе была хоть какая-то подсветка, скачиваем плагин PowerShell → настраиваем для расширения glue
синтаксис PowerShell.
4. Достоинства
- Не нужно выходить из Sublime Text, чтобы запускать команды,
- Достаточно многофункциональный плагин,
- Удобнее осуществлять навигацию по output, если тот большой, во вкладке, нежели в консоли.
5. Недостатки
- Разработка прекращена, шанс, что ответят на Ваш багрепорт, минимален,
- А багов, которые не воспроизводятся в других терминалах, достаточно. Так, не рекомендовал бы пушить изменения Git через Glue.
- Лимиты. Cash в Glue не запустишь.
6. Дополнительные ссылки
2. SublimeREPL
Позволяет запускать REPL консоль для многих языков программирования во вкладке Sublime Text. В примере этого ответа написано, как настроить SublimeREPL для PowerShell.
1. Оценка
2. Демонстрация
3. Установка и настройка
Помимо самого SublimeREPL устанавливаем также плагины Suricate и PowerShell для настройки команды SublimeREPL и подсветки синтаксиса соответственно. Инструкция по настройке команд в Suricate.
Ctrl+Shift+P → SublimeREPL: PowerShell
→ если у Вас русская версия операционной системы, может вылезти всплывающее окно с примерно следующей ошибкой:
error: UnicodeDecodeError('utf-8', b'C:\\Users\\\x8a\xae\xe2', 9, 10, 'invalid start byte')
В таком случае перейдите в файл Default.suricate-profile
(как — см.
// SublimeREPL PowerShell
"sublime_repl_powershell": {
"caption": "SublimeREPL: PowerShell",
"keys": ["super+alt+p"],
"call": "sublime.repl_open",
"args": {
"type": "powershell",
"encoding": "utf8",
"cmd": ["powershell", "-"],
"cwd": "$file_path",
"external_id": "powershell",
"syntax": "Packages/PowerShell/Support/PowerShellSyntax.tmLanguage"
}
},
4. Параметры аргументов
type
— тип. Означает, что во вкладке запустится консоль PowerShell, а не какая-либо другая вроде Python или Node.encoding
— кодировка.cmd
— запускаем PowerShell в консоли Windows.cwd
— указываем системную переменную.$file_path
означает, что SublimeREPL PowerShell запустится в папке файла, находясь в котором мы запустили SublimeREPL PowerShell.external_id
—- Во-первых, данным параметром определяется, как будет называться вкладка с PowerShell. Если оставить параметру пустое значение,
"external_id": ""
, то во вкладке будет указан полный путь к файлуpowershell.exe
:
Мы назвали вкладку
, но можно по-любому. Если подставите значениеsashatriumph
, ничего не должно поломаться: - Во-вторых, значение параметра
external_id
является именем файла, где хранится история команд, когда-либо вводимых Вами в SublimeREPL PowerShell. Файл c расширением.db
располагается по путиPackages/User/.SublimeREPLHistory
.
- Во-первых, данным параметром определяется, как будет называться вкладка с PowerShell. Если оставить параметру пустое значение,
syntax
— относительный путь к файлу синтаксиса для подсветки вкладки SublimeREPL PowerShell, начиная с Packages.
5. Достоинства
- Не нужно выходить из Sublime Text, чтобы запускать команды,
- Удобнее осуществлять навигацию по output, если тот большой, во вкладке, нежели в консоли.
- Особенно нравится, что запоминаются все команды, которые когда-либо вводили.
6. Недостатки
- Кодировки. Если приходится работать не только с английскими символами, ещё замучаетесь бороться с багами.
- Разработка прекращена, шанс, что ответят на Ваш багрепорт, минимален,
- Не всё, что работает в PowerShell, работает в SublimeREPL PowerShell. Например, Cash в Glue не запустишь. SublimeREPL PowerShell не получится заменить терминал полноценно.
7. Дополнительная ссылка
3. Terminality
В примере показан вывод для Python, но можно использовать как консоль и для других языков программирования, включая отсутствующие по умолчанию в плагине.
1. Оценка
Использую для обучения Python и PHP.
2. Демонстрация
3. Установка и настройка
Загружаем плагин через Package Control → открываем файл hangman.py
, вывод из которого собираемся осуществить, → Ctrl+Shift+P → Terminality: Browse Commands...
→ Run hangman.py — <sub><sup>Run hangman.py as Python 2.7 document</sup></sub>
→ видим результат в новой вкладке, включая время, потраченное на компиляцию, в сантисекундах. Обратите внимание, что пунктом меню Run hangman.py as Python3
запускается команда python3
Run hangman.py
— команда python
. Даже когда у Вас установлен Python 3, а не Python 2, если исполняемый файл Python называется python.exe
, а не python3.exe
, выбирайте Run hangman.py — <sub><sup>Run hangman.py as Python 2.7 document</sup></sub>
.4. Достоинства
- Не нужно выходить из Sublime Text, чтобы запускать команды,
- Удобнее осуществлять навигацию по output, если тот большой, во вкладке, нежели в консоли.
- Активно поддерживается разработчиками.
5. Недостатки
6. Дополнительные ссылки
Достоинства и недостатки относятся уже к вызываемым в Sublime Text терминалам, а не самому Sublime Text.
1. Консоль/GNOME Terminal
1. Установка и настройка
Устанавливаем плагин Suricate. Ctrl+Shift+P → Suricate: Open Terminal Here...
→ откроется новое окно с консолью для Windows и GNOME Terminal для Linux соответственно в директории с тем файлом, который был у Вас открыт, когда запускали терминал.
2. Параметры и их значения
Как выглядит конфигурационный файл Suricate:
// Open terminal. "open_terminal_here": { "call": "Suricate.lib.process.spawn", "caption": "Open Terminal Here...", "flags": "Windows|Linux", "args.windows": {"cmd": ["start", "cmd.exe"], "working_dir": "${file_path}"}, "args.linux": {"cmd": ["gnome-terminal"], "working_dir": "${file_path}"}, },
(В оригинальном массиве также есть параметры/значения "group": "launch"
, |IsFile
, "context_menu": true
, каковые я опустил в силу того, что считаю их излишними.)
flags
— параметр, при помощи которого можно задать различные аргументы для операционных систем или систем управления версиями.args.windows
иargs.linux
— параметры запуска терминалов Windows и Linux.
Дополнительная ссылка
2. Запуск любого предпочтительного терминала
Для примера возьмём, как запустить Git Bash из Sublime Text.
1. Установка и настройка
Устанавливаем плагин Suricate → в файл Default.suricate-profile
добавляем следующий код:
// Запустить Git Bash
"git-bash": {
"call": "Suricate.lib.process.spawn",
"args.windows": {
"cmd": ["C:\\Program Files\\Git\\git-bash.exe"],
"working_dir": "${file_path}"
},
"caption": "Git Bash",
"keys": ["<c>+super+keypad3"],
},
Ctrl+Shift+P → Suricate: Git Bash
→ должен открыться Git Bash в директории с тем файлом, который был у Вас открыт, когда запускали Git Bash из Sublime Text.
2. Дополнительная ссылка
3. Плагин Terminal
1. Описание
Кроссплатформенный плагин, позволяющий открывать из Sublime Text любой терминал, который лично Вы считаете наиболее предпочтительным. В Windows по умолчанию запускается PowerShell. После установки плагина доступны 3 варианта запуска:
- Из command palette,
- Из контекстного меню сайдбара,
- Шорткатом. Многим пользователям не нравится, что задействуется сочетание, по умолчанию используемое для переоткрытия последней закрытой вкладки, можете перезаписать шорткат в файле пользовательского кеймапа.
Вызываются две команды:
open_terminal
— открывает терминал в папке, где лежит файл, вкладка с которым была открыта, когда запускали терминал.open_terminal_project_folder
— возможно, работает некорректно. Актуальное поведение:- Если Вы запустили команду, из файла, который находится в верхней папке Вашего сайдбара или её подпапках, терминал запустится в этой верхней папке. Например, мой сайдбар:
Когда я запускаюopen_terminal_project_folder
, например, из файлаE:\Киролайна\SashaFolder\SashaFile.txt
, терминал откроется вE:\Киролайна
. - Но когда Вы запускаете команду из файла, не имеющего отношения к верхней папке Вашего сайдбара — в моём случае
E:\Киролайна
, — поведение командыopen_terminal_project_folder
аналогично поведениюopen_terminal
.
- Если Вы запустили команду, из файла, который находится в верхней папке Вашего сайдбара или её подпапках, терминал запустится в этой верхней папке. Например, мой сайдбар:
2. Настройка
Вы можете указывать параметры запуска Вашего терминала. Положим, хотите всегда запускать консольный эмулятор cmder только из директории E:\SashaSublime.
Для упрощения работы с настройками Sublime Text скачиваем плагин Preferences Editor. Ctrl+Shift+P → Edit Preferences: Edit Settings...
→ Terminal
→ terminal
→ в открывшуюся quick panel вставляете путь к исполняемому файлу cmder.exe вместе с именем файла, например, E:\Chocolatey\tools\cmder\Cmder.exe
→ Enter. Далее Ctrl+Shift+P → Edit Preferences: Edit Settings...
→ Terminal
→ parameters
→ между квадратными скобками вставляем "/START", "E:\\SashaSublime"
→ Enter. Обратите внимание, что если значения заключены в [квадратные скобки], необходимо экранировать слэши: E:\Chocolatey\tools\cmder\Cmder.exe
, но E:\\SashaSublime
.
Теперь после запуска любой из команд — open_terminal
либо open_terminal_project_folder
должен открыться Cmder.exe
в папке E:\SashaSublime
.
Также предусмотрена возможность одним шорткатом запускать один терминал со своими параметрами, вторым хоткеем запускать другой терминал с другими параметрами и т. д. Читаем здесь.
3. Дополнительные ссылки
4. ConEmu
Для лучшей, по мнению пользователей англоязычного Stack Overflow, консоли для Windows есть свой плагин. См. также плагин для Cmder — немного изменённого ConEmu.
1. Описание
По умолчанию осуществляется запуск PowerShell в оболочке ConEmu. Как и в плагине Terminal, ConEmu можно запустить из command palette, контекстного меню сайдбара или шорткатом.
open_conemu_here
— открывает ConEmu в папке, где лежит файл, вкладка с которым была открыта, когда запускали ConEmu.open_conemu_project
— возможно, работает некорректно. Всегда открывает ConEmu в верхней папке сайдбара, в моём случае (см. п. 3.3) этоE:\Киролайна
.
2. Недостатки
- Разработчик перешёл на MacOS, плагин больше не поддерживается.
- Баги. я пофиксил, что нашёл, но далеко не факт, что их больше не осталось.
3. Дополнительные ссылки
1. Console Exec
1. Оценка
Пользуюсь вместо дефолтных Build System.
2. Описание
Плагин выводит результаты Build System во внешнюю консоль, а не встроенную Sublime Text. Это может понадобиться по ряду причин.
- Если после вывода требуется вводить что-то ещё в консоль , — дефолтным механизмом Build System без дополнительных надстроек не обойтись. Установив же Console Exec и добавив в файл Build System всего одну дополнительную строку, Вы можете и дальше вводить команды.
- Если пользуетесь плагином Build Next, когда в выводе нет ошибок, встроенная панель Build System автоматически закрывается.[ ]*File \»(…*?)\», line ([0-9]*)»,
«selector»: «source.python»,
«target»: «console_exec»
}
Как создавать и настроить автоматический выбор Build System, подробно рассмотрено по дополнительным ссылкам.
Во вкладке со скриптом на Python Ctrl+Shift+P →
Build With: SashaPythonExec
→ смотрим результат.5. Дополнительные ссылки
2. Send to Shell
В Sublime Text существуют плагины, отправляющие во внешний терминал выделенный или скопированный текст, как SendText и SendREPL. Тот же принцип действия у плагина Send to Shell, отправляющего скопированный текст в IPython — интерактивную оболочку для Python, составляющую Jupyter.
1. Демонстрация
2. Установка
Как настроить плагин для отправки скопированного текста на ConEmu в режиме PowerShell.
- Скачиваем и устанавливаем последнюю версию Python, если Python ещё не установлен в системе.
- Устанавливаем Jupyter, проще всего, запустив в терминале команду
pip install jupyter
. - Устанавливаем через Package Control PyWin32 — набор расширений Python для доступа ко многим функциям Windows API.
- Устанавливаем через Package Control плагин Preferences Editor для упрощения работы с файлами настроек Sublime Text.
- Устанавливаем через Package Control плагин Send to Shell.
3. Настройка
Задаём системную переменную PATH, указав в качестве значения путь к файлу
ConEmu.exe
, для меня этоC:\Program Files\ConEmu
.Запускаем ConEmu → Super+Alt+P →
Startup
→ задаём параметруSpecifed named task
значение{Shells::PowerShell}
:В Sublime Text 3 Ctrl+Shift+P →
Edit Preferences: Edit <kbd>Settings...
→SendToShell
→powershell_startup
→ в открывшееся поле вместоpowershell
вписываемconemu
. Ctrl+Shift+P →Edit Preferences: Edit Settings...
→SendToShell
→window_title
→ в открывшееся поле вместоWindows PowerShell
вписываем заголовок вкладки ConEmu: у меня этоpowershell (Admin)
.Опционально предлагаю установить плагин CopyOnSelect, — пусть по первому времени он вызвать неудобства, — копирующий в буфер обмена выделенный текст. Задержка между выделением текста и его копированием в данном плагине составляет секунду, и автор не рекомендует её сильно уменьшать из-за возможных проблем с работой Clipboard-менеджеров.
Настройка окончена. Выделяем кусок скрипта на Python для отправки в ConEmu → копируем его (а с плагином CopyOnSelect достаточно только выделить) → запускаем команду
sendtoshell {"how": "paste_selection"},
— по умолчанию сочетанием клавиш Ctrl+Shift+Enter, — в ConEmu пишем командуipython
, а затем%paste
. Можно было, конечно, написать плагин так, чтобы пользователь совершал поменьше действий.4. Недостатки
5. Дополнительные ссылки
Если описанные в обзоре плагины не удовлетворяют Вашим задачам, помимо обычного поиска в Google порекомендовал бы осуществить поиск примерно по следующим ключевым словам и меткам на сайте Package Control:
Как сделать вывод результатов компиляции PHP в новую вкладку Sublime Text?
Установка
Обязательно
- PHP. Если Вы пользуетесь Chocolatey, запустите в терминале команду
cinst php -y
. - Terminality. Плагин, с помощью которого решается данный вопрос.
Опционально
Плагины, чтобы не править конфигурационные файлы вручную. Дальнейшие действия в моём ответе подразумевают, что они установлены.
- Preferences Editor,
- Keymap Redefiner. (WARNING! Плагин удаляет комментарии из файла
.sublime-keymap
. Если они вам нужны, не пользуйтесь данным плагином.) Увы, но другого решения, чтобы не лезть в кеймап вручную, похоже, нет.
Настройка Terminality для PHP
Ctrl+Shift+P →
Edit Preferences: Edit Settings...
→Terminality
→execution_units
→ вставляем такой код:{"source.php": {"run": {"command": "php $file"}}}
→ Enter.
Параметры
command: php $file
— запуск компилирования для файла в открытой вкладке.source.php
— область видимости для синтаксиса PHP в Sublime Text.Назначение горячих клавиш
Если у Вас, как у меня, дефолтное сочетание Ctrl+Alt+P забито другим плагином, поменяйте его. Ctrl+Shift+P →
Keymap Redefiner: Define Keymap
→Terminality
Ctrl+Alt+R (в Windows; есть ещё Ctrl+Alt+Shift+R для запуска команды с аргументами) → меняем хоткей на свободный. Чтобы хоткей наверняка не был ничем занят, биндим клавишу цифровой клавиатуры, например, super+keypad_multiply.keypad_multiply
— клавиша*
над девяткой в Numpad. Жмём Enter.Результат
Создаём любой файл с расширением
php
→ пишем «Hello World» или любой другой простой код → сохраняем файл → запускаем команду Terminality шорткатом, который мы только что задали. Должно получиться вот так.Как и в стандартном для Sublime Text выводе через output console указывается время, потраченное на компиляцию, но уже в Title Bar и вкладке, в сантисекундах.
Для ознакомления с прочими возможностями и настройками Terminality читайте README.MD в репозитории данного плагина на GitHub.
Как переформатировать код HTML с помощью Sublime Text 2?
У меня есть плохо отформатированный код HTML, который я хотел бы переформатировать. Есть ли команда, которая автоматически переформатирует код HTML в Sublime Text 2, чтобы он выглядел лучше и его было легче читать?
html sublimetext2 sublimetext indentation reformat
Поделиться Источник Ravi Ram 12 января 2012 в 17:4915 ответов
2094Для этого вам не нужны никакие Плагины. Просто выберите все строки (Ctrl A), а затем в меню выберите Edit → Line → Reindent. Это будет работать, если ваш файл сохранен с расширением, содержащим HTML, например
.html
или.php
.Если вы делаете это часто, вы можете найти это ключевое сопоставление полезным:
{ "keys": ["ctrl+shift+r"], "command": "reindent" , "args": { "single_line": false } }
Если ваш файл не сохранен (например, вы просто вставили фрагмент в новое окно), вы можете вручную установить язык отступа, выбрав пункт меню View → Syntax →
language of choice
перед выбором опции reindent.Поделиться peter 04 июня 2012 в 21:47
376Существует около полудюжины способов форматирования HTML в Sublime. Я протестировал каждый из самых популярных плагинов (Подробнее см. статью, которую я сделал в своем блоге ), но вот краткий обзор некоторых из самых популярных вариантов:
Команда Reindent
Плюсы:
- Поставляется с Sublime, поэтому установка плагина не требуется
Аферы:
- Не удаляет лишние пустые строки
- Не может обрабатывать уменьшенные HTML, строки с несколькими открытыми тегами
- Не правильно форматирует
<script>
блоков
Плюсы:
- Поддерживает ст2/СТ3
- Удаляет лишние пустые строки
- Никаких двоичных зависимостей
Аферы:
- Давится на бирках PHP
- Не правильно обрабатывает блоки
<script>
Плюсы:
- Ручки PHP тегов
- Некоторые настройки для настройки форматирования
Аферы:
- Требуется PHP (возвращается к веб-сервису)
- Только ST2
- Брошенный?
Плюсы:
- Поддерживает ст2/СТ3
- Простой и без бинарных зависимостей
- Поддержка OS X, Win и Linux
Аферы:
- Немного задыхается от встроенных комментариев
- Расширяет свернутый / сжатый код
Плюсы:
- Поддерживает ст2/СТ3
- Ручки HTML, CSS, JS
- Отличная интеграция с меню возвышенное по
- Легко настраиваемый
- Настройки для каждого проекта
- Формат при сохранении
Аферы:
- Требуется Node.js
- Не очень хорошо для встроенного PHP
Что лучше?
HTML-CSS-JS Prettify-победитель в моей книге. Много отличных функций, не на что жаловаться.
Поделиться Josh Earl 18 января 2014 в 16:29
179Единственный пакет, который мне удалось найти, — это тег .
Вы можете установить его с помощью элемента управления пакетом. https:/ / sublime.wbond.net
После установки пакета управления. Перейдите в раздел Управление пакетами ( Настройки -> Управление пакетами), затем введите
install
, нажмите enter . Затем введитеtag
и нажмите enter .После установки тега выделите текст и нажмите ярлык Ctrl + Alt + F .
Поделиться dardub 13 января 2012 в 23:12
- Sublime Text 2 HTML проблема подсветки синтаксиса
У меня есть проблема с подсветкой синтаксиса для HTML (и открытого текста) в Sublime Text 2, так как он только выделяет серым цветом строки, как на изображении. Всякий раз, когда я переключаюсь на Python, JavaScript и другие языки, подсветка работает нормально. Я новичок в Sublime Text 2, так что…
- Как запустить код PHP в Sublime Text 2
Я очень новичок в Sublime text 2. Я только начал этим пользоваться и ничего об этом не знаю. Я хочу работать над PHP. Я построил систему ‘php’. После выбора системы сборки ‘php’ я создаю новый файл и пишу код PHP только с одной строкой echo и пытаюсь запустить его. Каждый раз, когда он дает мне…
51Я рекомендую этот плагин: HTML/CSS/JS Prettify, он действительно работает.
После установки просто выберите код и нажмите Ctrl+Shift+H .
Готово!
Поделиться Peter Zhu 07 января 2015 в 03:22
41Просто общий совет. Что я сделал, чтобы автоматически привести в порядок свой HTML, так это установил пакет HTML_Tidy, а затем добавил следующую привязку клавиш к настройкам по умолчанию (которые я использую):
{ "keys": ["enter"], "command": "html_tidy" },
это работает HTML аккуратно с каждым вводом. В этом могут быть и недостатки, я сам совсем новичок в Sublime, но, похоже, он делает то, что я хочу 🙂
Поделиться Anneke 01 ноября 2012 в 15:17
22Хотя вопрос касается HTML, я также хотел бы дополнительно дать информацию о том, как автоматически отформатировать ваш код Javascript для Sublime Text 2 ;
Вы можете выбрать весь свой код (ctrl + A ) и использовать встроенную функциональность reindent(
Edit
— >Line
— >Reindent
) или использовать плагин форматирования JsFormat дляSublime Text 2
, если хотите иметь более настраиваемые настройки форматирования кода в дополнение к настройкам вкладки/отступа Sublime Text по умолчанию.https://github.com/jdc0589/JsFormat
Вы можете легко установить JsFormat с помощью Package Control (
Preferences
->Package Control
) откройте package control, затем введите install, нажмите enter . Затем наберитеjs format
и нажмите enter, все готово. (Контроллер пакета покажет состояние установки с успехом и ошибками в нижней левой строкеSublime
)Добавьте следующую строку к вашим привязкам ключей (
Preferences
— >Key Bindings User
){ "keys": ["ctrl+alt+2"], "command": "js_format"}
Я использую ctrl + alt + 2 , вы можете изменить эту комбинацию клавиш, как вы хотите. До сих пор
JsFormat
-хороший плагин, стоит попробовать!Надеюсь, это кому-то поможет.
Поделиться Gokhan Tank 24 июня 2013 в 11:34
Поделиться Christian Hagelid 08 сентября 2012 в 11:00
13Для меня решение
HTML Prettify
было чрезвычайно простым. Я перешел на страницу HTML Prettify .- Нужны
Sublime Package Manager
- Следуйте инструкциям по установке менеджера пакетов здесь
- набрал cmd + shift + p , чтобы открыть меню
- Набирается
prettify
- Выберите в меню пункт
HTML prettify
Бум. Сделано. Выглядит великолепно
Поделиться insaineyesay 27 июля 2014 в 16:01
11Просто зайдите в
Edit -> Tag -> автоформатирование тегов в документе
Поделиться Ricardo Martins 09 октября 2012 в 00:23
9Я создал пакет под названием HTMLBeautify , который делает приличную работу по переформатированию HTML. Я основал его на скрипте Perl, который нашел еще в 1997 году— — я обновил его, чтобы работать со всеми новыми модными современными тегами. 🙂
Проверьте это и дайте мне знать, что вы думаете!
https://github.com/rareyman/HTMLBeautify
Поделиться Ross 21 января 2013 в 18:46
7Я еще не имею права комментировать, так что это просто дополнительная информация, связанная с ответом @peter’s выше ответа.
Я обнаружил, что HTML не выровнялся, как ожидалось, если IE условный комментарий в заголовке не был полностью встроен, например, заподлицо слева:
<!--[if lt IE 7]> <p>Your browser is <em>unsupported</em>. <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p> <![endif]--> <!-- Le HTML5 shim, for IE6-8 support of HTML elements --> <!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->
Поделиться newtriks 21 ноября 2012 в 10:10
Поделиться Allen Bargi 14 января 2012 в 12:59
7Существует хороший плагин с открытым исходным кодом CodeFormatter, который (наряду с переиндентированием) может украсить грязный код, даже если весь он находится в одной строке.
Поделиться side2k 23 апреля 2014 в 07:34
4Я использую tidy вместе с пользовательской системой сборки, чтобы приукрасить HTML.
У меня есть HTMLTidy.sublime-build в моем каталоге Packages/User/:
{ "cmd": ["tidy", "-config", "$packages/User/tidy_config.cfg", "$file"] }
и файл tidy_config.cfg в том же каталоге:
indent: auto tab-size: 4 show-warnings: no write-back: yes quiet: yes indent-cdata: yes tidy-mark: no wrap: 0
И просто выберите build system и нажмите ctrl + b или cmd + b , чтобы переформатировать содержимое файла. Одна из незначительных проблем заключается в том, что ST2 не перезагружает файл автоматически, поэтому, чтобы увидеть результаты, вам нужно переключиться на какой-то другой файл и обратно (или на другое приложение и обратно).
На Mac я использовал macports для установки tidy, на Windows вам придется скачать его самостоятельно и указать рабочий каталог в системе сборки, где находится tidy:
"working_dir": "c:\\HTMLTidy\\"
или добавьте его к PATH.
Поделиться rchl 18 февраля 2012 в 22:46
4вы можете легко установить комбинацию клавиш F12 !!!
{ "keys": ["f12"], "command": "reindent" , "args": { "single_line": false } }
подробности смотрите здесь .
Поделиться Sumeta Pongpanna 21 ноября 2014 в 15:55
Похожие вопросы:
Использование virtualenv с sublime text 2Я использую sublime text 2 для разработки python вместе с virtualenv! Стандартная система сборки sublime text 2 использует стандартную установку python, а не my virtualenv, где установлены мои…
Sublime Text 2: могут ли Плагины рендерить HTML?Я хочу добавить некоторую визуальную привлекательность великому плагину sublime-phpunit Стюарта Герберта. В настоящее время он отображает текстовый вывод PHPUnit в маленьком окошке в нижней части…
Как запустить код Python из Sublime Text 2?Я хочу настроить полный Python IDE в Sublime Text 2. Я хочу знать, как запустить код Python из редактора. Делается ли это с помощью системы сборки? Как мне это сделать ?
Как правильно отформатировать / отступить код HTML и PHP в Sublime Text 3мне интересно, есть ли какой-нибудь плагин Sublime Text 3, кроме HTML Tidy, который способен переиндентировать или переформатировать части кода HTML
Изменение HTML <script> автозаполнение в Sublime Text 2В Sublime Text 2 при вставке тега сценария html с помощью функции автозаполнения курсор перемещается в конец тега. <script type=text/javascript></script>*CURSOR HERE* Как я могу изменить…
Sublime Text 2 HTML проблема подсветки синтаксисаУ меня есть проблема с подсветкой синтаксиса для HTML (и открытого текста) в Sublime Text 2, так как он только выделяет серым цветом строки, как на изображении. Всякий раз, когда я переключаюсь на…
Как запустить код PHP в Sublime Text 2Я очень новичок в Sublime text 2. Я только начал этим пользоваться и ничего об этом не знаю. Я хочу работать над PHP. Я построил систему ‘php’. После выбора системы сборки ‘php’ я создаю новый файл…
sublime text 2 html автозаполнение в файлах js/jsxЯ хотел бы иметь возможность автоматически заполнять теги HTML внутри файлов js / jsx в Sublime text 2. Я установил Babel-sublime , но автозаполнение HTML в нем не поддерживается. Есть еще варианты?…
Как запустить javascript на sublime text 2?Я работаю над созданием эскизной доски и задаюсь вопросом, Как создать файл JavaScript в Sublime Text 2. Когда я сохраняю файл, я просто сохраняю его как index.js? Таким образом, означает ли это,…
Как упорядочить код в sublime text с помощью сочетания клавиш?я хочу использовать комбинацию клавиш для упорядочивания кода в sublime text. Как я могу упорядочить код в sublime text с помощью сочетания клавиш?
PhpStorm vs SublimeText :: Блог веб разработчика
На днях решил перейти с SublimeText2 на что-то более IDE-шное и продвинутое. Уж очень стало не хватать нормального автокомплита и банальных возможностей рефакторинга вроде переименования переменных. Выбор пал на PhpStorm.
Почему именно PhpStorm?
Aptana я уже пробовал. Не понравилась, т.к. довольно глючная (возможно сейчас ситуация изменилась, я пробовал давно). А следующим на слуху был именно шторм.
На самом деле у jetBrains все среды разработки построены на базе одной единственной IDEA. Можно поставить ее и расширить нужными плагинами. Но. Стоит она в два раза больше, а использовать в одной IDE разные языки (например, PHP и Java) я уж точно не буду, это извращение. Поэтому проще поставить уже заточенную под веб PhpStorm. На самом деле есть еще одна веб-IDE: WebStorm. Но она работает исключительно с HTML/CSS/JS. А PhpStorm по сути ее полный клон плюс плагины для PHP.
В чем прелесть перед SublimeText?
Конечно, саблайм — редактор, а PhpStorm — IDE, тут не поспоришь. Поэтому отличия довольно стандартные для IDE, но в данном случае я точно могу сказать, что работает PhpStorm быстро, не стопоря систему.
- Автокомплит всего и вся. Даже учитывая, что PHP полностью динамичен подсказки по PHPDoc работают быстро и безошибочно.
- Отличная интеграция с Symfony2.
- Адекватный анализатор кода. Подскажет где у вас есть неиспользуемые переменные, лишние use классов и пр. Работает довольно шустро.
- Удобная работа с Git. Визуальные commit, push, pull, diff. И все это мышкой для ленивых.
- Встроенная консоль, в том числе SSH.
- Отжирает на 100-200Мб больше SublimeText, что по сути очень мало для IDE.
- Шустрый интерфейс, даже учитывая, что я только что «слез» с саблайма, а PhpStorm написан на Java.
- Единственная полноценная IDE в которой мне удобно делать небольшие правки на чужих проектах по FTP. При этом выкачивать весь проект не обязательно.
- Синхронизация всех настроек между компьютерами: IntelliJ Configuration Server Plugin
- Множество полезных фич, которых просто не может быть в SublimeText
Недостатки?
- Время запуска увеличилось с пары секунд до, примерно, секунд двадцати.
- Нет возможности в пределах одного проекта примаппить несколько FTP серверов в разные папки. (На самом деле есть, но жутко извращенная и неудобная).
- Нет мультикурсора. (Уже есть в PhpStorm 8 EAP)
- Нет поддержки 100500 форматов из коробки. Да, в шторме вы сможете нормально редактировать только веб-проекты. Хотя мне это не особо мешает.
- Нет бесконечного триала. PhpStorm стоит 99$ на одного человека. При этом персональную лицензию можно использовать на работе.
- Не удобное переключение между проектами. Решается с помощью плагина.
PhpStorm. Как нормально работать с FTP
После SublimeText и плагина SFTP наверняка захочется чего-то подобного. И PhpStorm единственная IDE в которой мне удобно работать с FTP. Не верьте статьям, где расписано в 100500 шагов «Как настроить FTP в PhpStorm», это все бред, на самом деле это очень просто.
Для начала создаем новый пустой проект. Вот прям совсем пустой.
Заходим в настройки проекта: File -> Settings (Ctrl + Alt + S). И выбираем раздел Deployment, нажимаем зеленый плюсик для добавления FTP соединения. Вводим параметры соединения (хост, логин, пароль и т.п.). В Root path нужно прописать корень проекта, так будет удобнее. Так же правее плюса добавления жмем Use as default. Примерно так:
На вкладке Mappings в поле Deployment path on server ‘temp’ ставим просто один слеш (/).
На этом настройка FTP закончена. Нажимаем OK и диалог с настройками закрывается.
Наводим мышкой в левый нижний угол IDE и в появившемся меню выбираем Remote Host. Вот и наш удаленный ФТП.
Теперь все так же как в SublimeText, смотрим файлы, жмем правой кнопкой и скачиваем нужное. Конечно при таком подходе автодополнение, как и 90% функций IDE, работать не будет, но для одноразовой мелкой правки этого хватит.
Выгрузка при сохранении и проверка удаленного файла как в SublimeText
В PhpStorm, да и во всей IDEA, нет понятия сохранения файла. Все сохраняется налету при каждом нажатии и, само собой, никуда не выгружается при каждом нажатии.
Чтобы сделать выгрузку файла на FTP по нажатию Ctrl+S нужно зайти в настройки проекта (Ctrl + Alt + S), в раздел Deployment -> Options. И установить следующие настройки:
- Upload changed file automatically to the default server: On explicit save action (Ctrl + S).
- Warn when uploading over newer file: Compare timestamp & size.
- И поставить галочку Notify about remote changes.
Теперь файлы будут выгружаться на FTP по нажатию Ctrl + S, а так же будет показано предупреждение, если ваша локальная копия не совпадает с удаленной, а вы пытаетесь ее редактировать.
Отдельно стоит рассмотреть удаление файлов. Если вы удалили файл из проекта, то на FTP он останется. Для того чтобы на FTP файл так же удалился нужно открыть любой другой файл и просто нажать Ctrl + S. Звучит странно, но при этом отлично работает, нужно только привыкнуть.
Выгрузка закоммиченных в Git файлов
Довольно полезная фича. При коммите в Git можно автоматически выгрузить все изменения на FTP. Выгружаются новые файлы, перемещения файлов и удаления файлов.
Однако только при коммите. Ни до, ни после, ни потом такой возможности не будет. К сожалению даже при checkout я не нашел способа сделать выгрузку. Хотя для этого есть git-ftp.
from 0 to 1
Установка и настройка Sublime text 3. Самые полезные плагины для верстки и не только.
Приветствую вас, друзья, на моём блоге по веб-разработке, наконец-то неслучайные случайности привели меня к началу работы над данным проектом. И первое, о чем я хочу вам поведать — это установка и настройка самых полезных плагинов для работы верстальщика в программе Sublime Text.
И так начнем с того, что перейдем на официальный сайт саблайм текст и скачаем его:
https://www.sublimetext.com/3
Также по этому материалу у меня есть соответствующий видос на ютубе:
Спасибо саблайму за то, что на данном этапе он нам поможет определиться, какую сборку нужно скачать, она будет выделена маркером.
Также, Вы можете скачать себе портативную версию, которую будет удобно держать на флешке и всегда быть во все оружие.
Далее приступаем к установке, и она ничем не отличается от установки обычной программы. После установки рекомендую перенести себе саблайм на панель задач, мне кажется удачным решением хранить самые часто используемые задачи на этой панели, для быстрого доступа к ним.
По окончанию установки, мы уже можем пользоваться саблаймом, но на мой взгляд он еще достаточно сыроват, и его нужно проапгрейдить определенными плагинами. Для того, чтобы у саблайма была возможность устанавливать их, необходимо провести некую работу, а именно связать его с менеджером управления пакетами Package Control.
Нам необходимо на сайте пекедж контрола
https://packagecontrol.io/installation#st3
скопировать определенную строчку кода для Sublime Text 3:
После чего в программе саблайм текст вызываем консоль, с помощью комбинации: Ctrl + ~. Вставляем в появившуюся строчку весь код и жмем Enter.
Отлично! Через некоторое время наш пакет установится. Теперь мы готовы приступить к установке первого своего плагина, он называется:
1. Advanced New File
С его помощью мы будем более просто создавать новые файлы и папки.
Первое, что вы должны запомнить, это то как вызывать сам менеджер, который мы только что установили, для этого на клавиатуре нужно нажать хоткей:
Ctrl+Shift+PПосле этого у нас появиться определенная панель в которую нужно вписать аббревиатуру PIP это сокращение обозначает Package Control: Install Package
Зачем писать больше, если можно писать меньше=) Выбираем данный пункт и переходим в меню, где можно уже непосредственно выбирать любой из плагинов. Прописываем здесь Advanced New File, кликаем на нем, после установки саблайм может выдать соответствующее сообщение.
Давай обучимся работе с этим плагином! Для этого нам нужно открыть сайтбар в саблайме view->side bar->show side bar Далее создадим у себя на компьютере папку «Тест» и простым перетаскиванием помещаем ее в сайтбар.
Если у вас уже есть какие-то папки, в сайдбаре важно, чтобы наша папка «тест» была самой верхней, после нажатия комбинации ctrl+alt+n внизу появиться поле, в котором можно прописывать путь, и тем самым создавать папки и файлы.
обратите внимание на путь, который находится ниже под строкой, именно по этому пути и будет происходить создание файлов и папок.
Давайте создадим базовую структуру. Написав index.html и нажав enter , я создал данный файл, а прописав css/style.css, создаться и папка css и сам файл стилей.
Как видите данный плагин нам здорово упростит жизнь.
Следующий плагин самый основной, без него код мы будем писать явно дольше, он называется Emmet.
2. Emmet
Для его устаноки повторим процедуру: ctrl+shift+p вибираем Package Control: Install Package, и в появившемся окне пишем Emmet.
Вуаля! Он установился. Закрываем сообщение, проверить его работу можно открыв файл index.html прописать в нем «!» и нажать кнопку таб.
У нас должна развернуться базовая структура, важно, она при «!» знаке будет разворачиваться только в файлах .html
Больше возможностей Emmet вы можете узнать из моей следующей статьи.
Следующий плагин который я хочу упомянуть называется BracketHighlighter.3. BracketHighlighter
Он нам необходим для того, чтобы более явно подчеркивать места открытия и закрытия тегов, устанавливается он также, только в последнем пункте мы будем писать уже его имя.
Вот, что было до его установки:
а вот, что получили:
Как видно, его мы установили не зря 😉
Дальше пойдет речь о плагинах, которые облегчат работу с CSS и это:4.Сolorhighlighter
5. Goto-CSS-Declaration
Устанавливаем их по очереди. Плагин colorhighlighter даст определенную подсветку цвета, это явно поможет быстрее ориентироваться в вопросах, касающихся цветовой палитры. Вот как будет выглядеть ваш css после его установки:
Каждый цвет будет подчеркиваться линией, а когда мы поставим курсор, то закраситься вся область.
Плагин Goto-CSS-Declaration поможет нам быстро в потоке css кода находить нужный селектор. Все что потребуется — это в html поставить курсор внутри необходимого класса или айдишника и нажать windows+alt+. или нажать на нем правую кнопку мыши и выбрать пункт Goto-CSS-Declaration. Сразу после этого действия у нас выделиться необходимый селектор в css.
И последний плагин который мы сегодня рассмотрим, это возможность подсветки синтаксиса SASS, в общем там нет особой сложности, но есть маленькое замечание, давайте разберемся…
6. SASS
Устанавливаем плагин SASS. После сообщения об установке наш код будет выглядить примерно вот таким образом:
То есть мы его установили, но он не активировался. Для его активации нужно в нижнем правом углу кликнуть на название — то, которое в данный момент видит саблайм. У меня это Plain Text, у вас это может быть Ruby или SASS.
Далее выбрать open all with current extension as…
В выпадающем списке проскролить вниз и выбрать пункт sass. Вы увидите возле него галочку, но в этом месте важно слишком рано не сдаваться и кликнуть еще раз:
После этого наш плагин заработает, и подсветка станет корректной.
На этом все друзья, если хотите и дальше получать от меня массу полезной информации — подписывайтесь на меня в соц. сетях.
Material Theme для Sublime Text 3 — Soft
Material Theme от Mattia Astorino — данная элегантная тема принесёт в ваш Sublime Text 3 немного материального дизайна, так продвигаемого компанией google.
Скриншоты
Material Theme поставляется в трех цветовых схемах: Обычная версия, Lighter-версия и Darker-версия.
Больше скриншотов можно увидеть на официальной странице проекта.Легкая установка
Вы можете установить эту удивительную тему, используя Package Control. Введите в поиске «Material Theme», нажмите установить, перегрузить Sublime TextРучная установка
- Cкачайте последнюю версию, распакуйте архив и переименуйте папку в «Material Theme».
- Переместите распакованную папку в директорию пакетов sublime (Preferences → Browse packages…)
- Активируйте тему через настройки (Preferences > Setting — User):
"theme": "Material-Theme.sublime-theme", "color_scheme": "Packages/Material Theme/schemes/Material-Theme.tmTheme",
Не забудьте перегрузить Sublime Text после активации тему.
Стили темы
Тема поставляется в двух стилевых версиях:Darker
"theme": "Material-Theme-Darker.sublime-theme", "color_scheme": "Packages/Material Theme/schemes/Material-Theme-Darker.tmTheme",
Lighter
"theme": "Material-Theme-Lighter.sublime-theme", "color_scheme": "Packages/Material Theme/schemes/Material-Theme-Lighter.tmTheme",
Известные баги
Если не видно нижнюю панель, где находится поиск/замена (смотрите тикет #67), пофиксить достаточно просто:Белые панели
Если вы хотите активировать белые панели и инпуты, придется поставить аддон «Material theme white panels» из Package Control. Не забудьте отключить аддон при активировании светлой темы.Опции темы
// мелкие табы "material_theme_small_tab": true, // скрыть иконки типов файлов в сайдбаре "material_theme_disable_fileicons": true, // Отключить анимацию папок "material_theme_disable_folder_animation": true, // мелкая статусная строка "material_theme_small_statusbar": true, // отключить файловый индикатор сайдбара "material_theme_disable_tree_indicator": true, // жирные лейблы у табов "material_theme_bold_tab": true, // показать разделитель табов "material_theme_tabs_separator": true, "material_theme_accent_lime": true, "material_theme_accent_purple": true, "material_theme_accent_red": true, "material_theme_accent_orange": true, "material_theme_accent_yellow": true, // показывать разделитель в нижней панели "material_theme_panel_separator": true, // автоширина у табов "material_theme_tabs_autowidth": true, // контрастный режим сайдбара и табов "material_theme_contrast_mode": true,
Рекомендованные настройки
"overlay_scroll_bars": "enabled", "line_padding_top": 3, "line_padding_bottom": 3, "always_show_minimap_viewport": true, "bold_folder_labels": true, // подсвечивать активный отступ "indent_guide_options": [ "draw_normal", "draw_active" ], // антиалиасинг на маковских ретинах "font_options": [ "gray_antialias" ],
Шрифт, используемый для отображения кода «Fira Code» с лигатурами (не поддерживаются в Sublime Text). Вы также можете использовать официальный моноширный шрифт от Material Design «Roboto Mono«.Цветовая палитра
ВКонтакте
Twitter
Facebook
Одноклассники
Linkedin
Telegram
WhatsApp
ПоделитьсяDark Mode Material Design Sublime Text Theme
SublimeLinter — обнаружение ошибок – Zencoder
Термин linting применяется для обозначения процесса обнаружения ошибок в исходных файлах программ, скриптов или документов. Программа такого рода должна иметься в инструментарии каждого разработчика, так как с помощью таких программ можно обнаруживать ошибки в процессе написания кода. Популярный редактор кода Sublime Text не имеет встроенных возможностей для обнаружения ошибок; однако такую ситуацию легко исправить.
При помощи linting‘а можно обнаруживать небольшие ошибки кода “на лету”, в процессе написания этого кода — например, пропущенную точку с запятой в JavaScript-коде. Возможность обнаружения ошибок в редакторе Sublime Text осуществляется с помощью плагина SublimeLinter, который необходимо установить прежде всего.
Если в какой-либо строке кода этот редактор обнаружит ошибку, то данная строка будет подсвечена в gutter редактора Sublime. Более того, если поместить курсор мыши в строку с ошибкой, то в status bar редактора Sublime Text отобразится краткое описание ошибки, что поможет принять меры для ее правильного устранения.
Ниже представлен наглядный пример подсветки ошибок в Sublime Text с помощью плагина SublimeLinter:
Плагин SublimeLinter сам по себе не выполняет процесса “отлавливания” ошибок в коде, так как является всего-лишь фреймворком, основой для других плагинов (linter), каждый из которых создан для обнаружения ошибок в каком-то определенном языке — JavaScript, PHP, Ruby, Python, HTML, CSS и так далее.
SublimeLinter в Sublime Text
Как уже упоминалось ранее, плагин SublimeLinter является фреймворком, основой для более маленьких плагинов (linter), которые осуществляют непосредственный поиск синтаксических ошибок в программном коде.
Поэтому первоначально необходимо установить этот фреймворк (как плагин) в редактор Sublime Text и самый простой способ это сделать — воспользоваться менеджером пакетов Package Control. Для этого нажимаем сочетание клавиш Shift+Ctrl+P (Linux \ Windows) или Shift+Cmd+P (Mac OSX). В поле поиска вводим название устанавливаемого пакета — SublimeLinter. Далее — производим установку.
Теперь необходимо определиться с тем, в каких языках программирования необходимо “отлавливать” ошибки. Другими словами, на каких языках программирования вы пишете и в каких из них вам необходима поддержка SublimeLinter.
Допустим, это серверный язык PHP. Тогда для включения возможности обнаружения ошибок в Sublime Text необходимо установить плагин SublimeLinter-php, так же через менеджер пакетов Package Control. Стоит оговориться, что дополнительной зависимостью этого плагина является язык PHP, который предустановлен в операционных системах Linux\MacOSX, но который необходимо заранее установить отдельно в операционной системе Windows.
Примером работы связки SublimeLinter + SublimeLinter-php в редакторе Sublime Text может послужить нижеследующее изображение:
Рассмотрим другой случай, когда в редакторе Sublime Text используется язык программирования JavaScript. Тогда для возможности отлавливания ошибок в JS-коде необходимо установить плагин SublimeLinter-jshint. В этом случае вопрос зависимостей этого пакета выглядит несколько сложнее. Плагин SublimeLinter-jshint основывает свою работу на JSHint, который необходимо установить в виде пакета под Node.js и устанавливается с помощью менеджера пакетов npm. Поэтому в операционной системе заранее должны быть установлены Node.js, npm и JSHint.
Примером работы плагина SublimeLinter-jshint может послужить нижеследующее изображение:
Рассмотрим еще один случай, когда в редакторе Sublime Text используется язык таблиц каскадных стилей CSS (куда же без него?). Тогда необходимо доустановить в Sublime Text плагин SublimeLinter-csslint.
Рассмотрение подобных плагинов (linter) можно продолжать еще долго. Поэтому ограничимся только тремя вышеприведенными. Стоит сказать, что для поиска какого-либо конкретного плагина (linter) удобно воспользоваться online-сервисом Package Control, в поисковой строке которого достаточно ввести начало названия искомого пакета, например, так — “SublimeLinter-“. Система автоматически выдаст список все плагинов под фреймворк SublimeLinter.
Как нетрудно заметить, окончание (суффикс) в названии каждого из плагинов является подсказкой, для поддержки какого языка был создан этот плагин. Например, для языка Ruby существует плагин SublimeLinter-ruby, для препроцессора Haml имеется плагин SublimeLinter-haml.
Также стоит сказать, что необходимо внимательно читать описание к каждому из тех плагинов, которые планируется установить, так как каждый из них имеет разные зависимости. Наглядный пример зависимостей у плагинов SublimeLinter-php и SublimeLinter-jshint был приведен выше.
Настройка SublimeLint
В плагине SublimeLint имеется большое количество настроек. Однако, с большинством из них не составит труда разобраться. Ниже приведено краткое описание некоторых из них.
Linting Modes
Эта настройка отвечает за поведение плагина SublimeLinter — когда плагин должен оповещать об обнаруженной ошибке в коде программы или документа.
- Background — это поведение по умолчанию плагина SublimeLinter. Сообщения об обнаруженных ошибках будут появляться по мере их обнаружения (другими словами — по мере написания строк кода) и будут обновляться каждый раз, когда будет производиться исправление обнаруженных ошибок. Такой режим может показаться излишне назойливым, так как иногда сообщение об ошибке может появиться прежде, чем будет дописана до конца инструкция, в которой вкралась ошибка.
- Load\Save — в этом случае сообщения об ошибках будут отображаться плагином только после сохранения или загрузки сохраненного документа.
- Save Only — сообщения об обнаруженных ошибках будут отображаться только при сохранении документа.
- Manual — ручной вызов проверки на ошибки, из командной панели редактора Sublime Text.
Лично я предпочитаю режим Load\Save, так как в этом случае плагин SublimeLinter не мешает работать с кодом до тех пор, пора не будет выполнено сохранение этого кода в файле. Режим Background может показаться излишне назойливым, так как сообщения об ошибках будут появляться постоянно, мешая работе.
Для того, чтобы изменить поведение плагина SublimeLinter через настройку Linting Modes, необходимо зайти в командную панель редактора Sublime Text с помощью сочетания клавиш (Shift+Ctrl+P или Shift+Cmd+P) и ввести в строке поиска следующее:
sublimelinter lint mode
… откроется выпадающий список со всеми настройками плагина SublimeLinter, из которого необходимо выбрать SublimeLinter: Choose Lint Mode:
Mark Style
Настройка Mark Style отвечает за внешний вид выделения ошибки в строке кода. Значением по умолчанию является outline. Но можно выбрать любое другое значение из предустановленных настроек.
В соответствии с официальной документацией SublimeLinter имеются несколько вариантов выделения ошибок в строке кода:
- fill
- outline
- solid underline
- squiggly underline
- stippled underline
Аналогично с режимом Linting Modes, режим Mark Style настраивается через командную панель редактора Sublime Text — Shift+Ctrl+P (Linux \ Windows) или Shift+Cmd+P (Mac OSX). В выпадающм списке нужно выбрать строку Sublime Linter: Choose Mark Style.
Ниже представлены скриншоты всех пяти режимов выделения ошибок в строке, чтобы можно было сравнить и выбрать наиболее подходящий вариант.
Fill
Outline
Solid Underline
Squiggly Underline
Stippled Underline
Gutter Themes
В дополнение к настройке выделения ошибок в строке кода, можно выполнить настройку иконок, который помещаются в области gutter редактора Sublime Text напротив строки с обнаруженной ошибкой. Такое выделение строки служит для большей информативности.
В плагине SublimeLinter имеется набор предустановленных иконок, наглядное изображение которых представлено ниже.
Blueberry – cross
Blueberry – round
Circle
Danish Royalty
Hands
Knob – simple
Knob – symbol
Koloria
ProjectIcons
Изменить настройки отображения иконок можно, зайдя в командную панель редактора Sublime Text и выбрав в выпадающем списке строку Sublime Linter: Choose Gutter Theme.
Заключение
Плагин SublimeLinter является очень мощным и гибким, а количество поддерживаемых им язык — очень большое. Вы можете посетить страницу поддерживаемых языков, чтобы убедиться в богатом выборе поддерживаемых языков программирования, разметки и многих других.
Рассмотренные в этой статье возможности плагина SublimeLinter являются далеко не исчерпывающими. На официальной странице документации вы всегда найдете для себя что-то новое. Для этого нужно только периодически просматривать эту документацию.
sublime textlintingEssential Sublime Text 3 Plugins для PHP-разработчиков
Sublime Text 3Sublime Text должен быть одним из самых популярных текстовых редакторов для кодирования. Хотя Sublime Text 3 все еще находится в стадии бета-тестирования, он относительно стабилен и очень удобен. Я лично использую его уже более 2-х лет как на работе, так и дома. Он сложный, легкий и простой в использовании. Он также работает на всех основных платформах: Windows, OSX и Linux.
Sublime Text — это не совсем IDE (интегрированная среда разработки), но с установкой нескольких пакетов / плагинов вы действительно можете сделать его идеальным редактором для разработки PHP в.
Есть несколько отличных пакетов для Sublime Text, которые помогут разработчикам PHP улучшить качество кода и рабочий процесс. Это то, что я считаю основными пакетами для разработки PHP в Sublime Text 3.
Прежде всего, это управление пакетами. Почему это не предустановлено, я не знаю. Я подозреваю, что большинство пользователей Sublime Text уже установили это, но если не установят его сейчас; это сделает установку всех других пакетов, перечисленных здесь (и многих других), чрезвычайно простой.Это что-то вроде эквивалента
apt-get
илиhomebrew
, если вы с ними знакомы. Вместо того, чтобы загружать пакеты вручную или git clone в папку Packages , вы можете просто установить (и удалить) пакеты с помощью палитры команд.Как только вы начнете использовать Package Control, вы удивитесь, как вы выжили без него!
Каждый разработчик делает случайную опечатку; забыв закрыть некоторые скобки, пропустить точку с запятой, и т. д.. Чтобы избежать этих ошибок, мы можем использовать линтер. SublimeLinter предоставляет основу для линтинга. Сами линтеры распространяются отдельно в виде дополнительных пакетов; для PHP вам понадобится SublimeLinter-php, который предоставляет интерфейс к
php -l
для проверки синтаксиса.Другие полезные линтеры для разработчиков включают SublimeLinter-jshint для JavaScript, SublimeLinter-json для JSON и SublimeLinter-csslint для CSS.
Хорошо написанный код должен использовать последовательный стандарт кодирования i.е. тип отступа, соглашения об именах, использование пробелов, размещение скобок, и т. Д. . Какой бы стандарт вы ни использовали, phpcs поможет вам соответствовать им.
В отличие от других пакетов, для этого требуется несколько внешних библиотек и некоторая конфигурация, чтобы заставить его работать; вам понадобится PHP CodeSniffer, PHP CodeSniffer Fixer и PHP Mess Detector. Установите эти библиотеки и задайте пути их выполнения в настройках phpcs в Sublime, и все будет в порядке.
Когда вы попытаетесь сохранить файл, он обнаружит любые проблемы со стилем файла. Детектор сообщений PHP будет проверять такие вещи, как потенциальные ошибки, чрезмерно сложные выражения и избыточный код.
Вы можете определить стандарт кодирования, на основе которого вы хотите разработать пакет, в настройках пакета. Доступны популярные стандарты, такие как PSR-2 и Zend, а также множество настраиваемых стандартов, таких как CakePHP, которые можно установить и настроить.
EditorConfig предоставляет способ поддерживать некоторую согласованность стилей кодирования между различными редакторами и IDE.Это особенно ценно при сотрудничестве с другими, некоторые из которых могут не использовать Sublime Text для кодирования. Стили для проекта определены в файле .editorconfig , который затем может быть прочитан текстовым редактором / IDE и принудительно применен. Это полезно, среди прочего, для определения стилей табуляции и окончаний строк. У большинства редакторов есть плагины для поддержки EditorConfig, включая Atom, Coda, PhpStorm и, конечно же, Sublime Text.
Вы можете узнать больше о EditorConfig и о том, что вы можете определить в .Editorconfig на официальном сайте. Подробную информацию о пакете Sublime Text EditorConfig можно найти на GitHub.
Хороший код должен быть хорошо документирован. PHPDoc — это в значительной степени повсеместно признанное средство сделать это в PHP; хотя многие разработчики считают документирование своего кода утомительным. DocBlockr упрощает процесс добавления комментариев PHPDoc (и JSDoc) путем автозаполнения
/ **
нажатием Введите или вкладка , снимая часть боли.Это действительно простой небольшой пакет, который отображает текущую функцию, которую курсор помещает в строку состояния внизу (рядом с номером строки).
Если вы работаете с Git, Mercurial или SVN, то VCS Gutter — удобный пакет для добавления визуальных подсказок относительно того, что изменилось в файле с момента последней фиксации. Он покажет небольшой значок в желобе, чтобы указать, что было добавлено, изменено или удалено.
Одна небольшая проблема, которую я обнаружил в этом пакете, заключается в том, что если вы хотите просмотреть большой файл журнала в Sublime, это может значительно замедлить реакцию редактора.В этих случаях я обычно временно отключаю VCS Gutter с помощью Package Control.
Это мои семь основных пакетов для разработки PHP в Sublime Text 3. Что вы используете? Не стесняйтесь вносить свои предложения в комментариях ниже.
My Sublime Text Setup для PHP
Я использую Sublime Text для кодирования на PHP уже несколько месяцев и за это время накопил несколько полезных плагинов и настроек редактора. Я не видел много недавних статей о настройке Sublime Text, особенно для PHP, поэтому я хочу поделиться тем, как работает моя настройка, и что было для меня наиболее полезным для продуктивного написания кода.
Предпочтения
Sublime Text имеет область настроек, где вы можете настроить макет редактора с помощью JSON. Вот мои любимые настройки:
{ "font_face": "Fira Code Retina", "font_size": 14, "line_padding_bottom": 2, "line_padding_top": 2, «highlight_line»: 14 "bold_folder_labels": правда, "правители": [80, 120], "tab_size": 4, "translate_tabs_to_spaces": правда, "trim_trailing_white_space": правда, "sure_newline_at_eof_on_save": true }
Я следую руководству по стилю PSR-2, предоставленному PHP-FIG, поэтому некоторые из этих настроек очень помогли в поддержании этого стиля.Линейки Настройка показывает вертикальную линию в вашем редакторе в качестве ориентира для длины строки. PSR-2 устанавливает предпочтительный предел на 80 символов и мягкий предел на 120, поэтому я показываю вертикальную линию на обеих длинах, чтобы знать, когда я перейду лимит. Вкладка Настройки гарантируют, что я всегда использую табуляцию с четырьмя пробелами для отступов (да, я предпочитаю пробелы табуляции). Часто я забываю добавить пустую строку в конец файла, поэтому параметр sure_newline_at_eof_on_save сделает это за вас автоматически.Если вам интересно, пустая последняя строка предназначена для того, чтобы git diff не отображался для добавления символа возврата в указанную выше строку, когда вы начинаете добавлять дополнительный код в файл.
Одна из моих любимых удобных настроек — это предпочтение highlight_line . Это заставит Sublime выделить строку, на которой находится курсор, что упростит поиск места, где вы печатаете. Наконец, я использую Fira Code в качестве шрифта. Это действительно хороший шрифт с лигатурами. Sublime Text теперь поддерживает лигатуры шрифтов, что делает ваш код действительно чистым.
Плагины
Для Sublime Text существует так много плагинов, что бывает сложно найти хорошие и полезные. Ниже в произвольном порядке перечислены все, что я считаю наиболее полезными.
Sublime PHP Companion добавляет несколько полезных команд для разработки PHP. В частности, мне очень нравится команда
Find Use
, которая автоматически добавит операторuse
вверху файла для имени класса под курсором. DocBlockr автоматически сгенерирует блоки документации для ваших PHP-методов, что значительно упростит документирование. Vintageous добавляет привязки клавиш vim (один из моих любимых плагинов). GitGutter покажет вам добавленные и измененные строки на боковой панели, что упростит поиск нового написанного вами кода. Плагин Babel добавляет подсветку синтаксиса ES6 и JSX. All Autocomplete добавит записи автозаполнения для всех файлов, которые вы открываете, что упрощает ссылки на методы для классов, которые вы открыли.Тема
В общем выпуске Sublime Text 3 команда добавила новую тему под названием Adaptive , которая автоматически настраивает внешний вид боковой панели и панели вкладок в соответствии с выбранной цветовой схемой. Две мои любимые цветовые схемы — Дракула и Solarized Dark (по умолчанию). Раньше я использовал тему Boxy, но с тех пор она устарела в пользу новой темы.
Вот как выглядит моя установка с использованием темы Дракулы.Если у вас есть любимые плагины или настройки Sublime Text, дайте мне знать в комментариях. Я всегда ищу новые возможности, которые можно опробовать.
Вот список нескольких сообщений в блоге, которые помогли мне создать эту установку:
Удачного кодирования!
Sublime Text 3 идеальная установка для разработки PHP
Это статья, продолжающая идеальную настройку для разработки PHP в Sublime Text 2. Я решил написать эту обновленную версию, потому что с некоторого времени появился Sublime Text 3.Возможно, он все еще официально бета, но работает довольно стабильно, и я использую его уже несколько месяцев.
Этот список почти такой же, как и в предыдущей статье — большинство плагинов, которые я использовал с ST2, были обновлены для работы с ST3, и я перестал использовать некоторые из них, поэтому их нет. Я немного ленив, поэтому некоторые описания скопированы из предыдущей статьи;)
Во всяком случае, вот список:
Управление пакетами (https://sublime.wbond.net)
Благодаря этому небольшому программному обеспечению все остальные плагины легко устанавливаются.
SublimeCodeIntel (https://github.com/SublimeCodeIntel/SublimeCodeIntel)
Это пакет, который я использую все время. Его задача — предоставлять подсказки, связанные с именами функций, объектов, переменных и т. Д. Он также указывает, какие методы и параметры доступны в объектах / классах. Он основан на Komodo CodeIntel и иногда вообще не работает. Но в большинстве случаев это круто 🙂
SublimeLinter (https: // sublime.wbond.net/packages/SublimeLinter)
Этот пакет выполняет для меня постоянную работу — он постоянно следит за тем, что я пишу, и мгновенно сообщает мне, если что-то не в порядке, например, я забываю точку с запятой или скобки.
(обновить) Начиная с версии 3 и выше, SublimeLInter стал модульным. Это означает, что вы должны сначала установить основной пакет, а затем плагин / модуль для каждого языка, для которого вам нужна поддержка. У каждого плагина есть свой набор требований, поэтому обязательно внимательно их прочтите.Для разработки на PHP + JavaScript я использую:
SideBarEnhancements (https://sublime.wbond.net/packages/SideBarEnhancements)
Предоставляет отличные новые возможности при щелчке правой кнопкой мыши по элементам боковой панели (файлам / папкам). Очень удобно.
Желоб VCS (https://sublime.wbond.net/packages/VCS%20Gutter)
В последнее время не представляю себе работы без этого. Каждый день я использую Git и Mercurial, и эти плагины предоставляют мне в реальном времени информацию о том, что было изменено (или добавлено / удалено) в текущем файле, используя символы в левом переплете окна редактирования.
SFTP , платный (http://wbond.net/sublime_packages/sftp)
Отличный пакет, позволяющий очень удобно использовать SFTP, FTP и FTPS. Он поддерживает просмотр удаленных папок, редактирование и синхронизацию между локальными и удаленными файлами. Также регулярная загрузка, загрузка, сохранение или открытие файла.
Tortoise (только в Windows) (http://wbond.net/sublime_packages/tortoise)
Я использую его как дополнительный пакет к SideBarGit, если работаю в среде Windows.В нем не так много функций, но те, что он предоставляет, очень полезны и интуитивно понятны. Если вам нравится Tortoise Git, но вы работаете в Linux, вы можете попробовать RabbitVCS. Он не интегрирован с ST2, но предоставляет удобный графический интерфейс Git при щелчке правой кнопкой мыши.
sublime-github (https://github.com/bgreenlee/sublime-github)
Каждый разработчик должен использовать какие-то фрагменты кода. Я использую Gist, предоставленный GitHub, и этот пакет позволяет мне использовать их мгновенно (сохранять / вставлять).
Тег (https://github.com/SublimeText/Tag)
Это отличный плагин, но теперь ST3 поддерживает сопоставление тегов, поэтому он мне больше не нужен.
PhpDoc (https://sublime.wbond.net/packages/PhpDoc)
Отличный плагин, помогающий писать блоки документации для PHPDocumentor.
Phpcs (http://soulbroken.co.uk/code/sublimephpcs)
Этот пакет добавляет поддержку PHP CodeSniffer в ST2.Он проверяет, написан ли ваш код в соответствии с одним из стандартов. Просто выберите один: Zend, PEAR … и другие 🙂 Посетите веб-сайт PHP CodeSniffer для получения подробной информации о конфигурации.
TrailingSpaces (https://github.com/SublimeText/TrailingSpaces)
Маленький ужас каждого кода — пустые места в конце строк, в конце файла. Особенно неприятно, если вы работаете над кодом с другими разработчиками, которые могут использовать разные редакторы / IDE, которые могут интерпретировать их (пустые пространства) по-разному.
BracketHighlighter (https://github.com/facelessuser/BracketHighlighter)
Такая же ситуация, как и с плагином Tag . В моем повседневном кодировании возможности ST3 по выделению скобок у ST3 достаточно хороши. Тем не менее, это по-прежнему отличный плагин.
Отображение имени возвышенной функции (https://github.com/akrabat/SublimeFunctionNameDisplay)
Отображает в нижней панели имя функции (или метода), в которую помещен курсор.Просто и полезно.
Терминал (http://wbond.net/sublime_packages/terminal)
Используя Git или, возможно, некоторые пакеты PEAR, вам может понадобиться время от времени переключаться на консоль и творить чудеса. Может использовать Zend Tool или что-нибудь «запечь»;) Именно для этого и предназначен этот плагин.
Клиент Xdebug (https://sublime.wbond.net/packages/Xdebug%20Client)
В последнее время мой любимый клиент Xdebug для ST3. Отлично работает и позволяет использовать все возможности отладки Xdebug.
Несколько вспомогательных пакетов. Считаю их необязательными, но они пригодятся:
LineEndings (https://sublime.wbond.net/packages/LineEndings)
Приятно иметь плагин, если вы работаете с другими разработчиками, использующими машины Windows и Unix / Linux. Он заботится о разных (невидимых) символах окончания строки в этих системах.
Sass (https://sublime.wbond.net/packages/Sass)
Это очень удобно при работе с файлами Sass.Подсветка синтаксиса и так далее.
PlainTasks (https://github.com/aziz/PlainTasks) добавлено благодаря комментарию Вириона
Отличный инструмент для всех, кто любит организовывать свои задачи, гибко и со множеством замечательных функций.
Sublimerge (http://www.sublimerge.com/)
Добавлено благодаря инструменту Вириона comment_Diff на стероидах. Идеально подходит для всех, кому приходится много работать со слиянием, особенно полезно, когда дело касается больших файлов.
DashDoc (https://sublime.wbond.net/packages/DashDoc) (только Mac)
Это только для пользователей Mac и только для тех, у кого установлен Dash, но я очень рекомендую его. Dash предоставляет доступ к документам практически всех основных библиотек, фреймворков и т. Д. И многому другому! С помощью этого плагина вы можете получить к нему доступ прямо из окна кода Subliem Text с помощью сочетания клавиш. Это действительно ускоряет кодирование.
На этом пока все.Я мог бы вернуться и что-нибудь позже, но это моя установка и отлично работает для меня.
Если вы знаете какой-либо плагин, который стоит упомянуть, дайте мне знать — я буду рад добавить его в свой список. Какие-либо предложения? 🙂
Sublime Text 3 Руководство по освоению PHP для разработчиков
Как разработчики программного обеспечения, мы проводим большую часть времени, глядя на код, пока ошибка не станет неудобной и не обнаружится, чтобы мы могли ее исправить; или мы пишем потрясающий код, за который нам будет стыдно через некоторое время.Независимо от дня и продуктивности, мы проводим большую часть времени в наших IDE или текстовых редакторах. Я решил потратить его на Sublime Text.
В своей жизни я использовал разные IDE, от NetBeans до Eclipse, Visual Studio и других, и всегда хорошо иметь что-то, указывающее на ваши ошибки, прежде чем даже опробовать решение, но для меня IDE казались слишком медленными. и несколько тормозит.
Когда дело доходит до кодирования с помощью текстового редактора, выбор широк, но его можно сузить до самых популярных: Vim, Notepad ++, Atom и Sublime Text.
Некоторое время назад я дал Notepad ++ шанс, но мне это не удалось; с Vim мое самое большое достижение — это «умение бросить курить!»; Атом я до сих пор не пробовал, но моему коллеге он очень доволен.
В этой статье я хочу показать вам, почему я выбрал Sublime Text и как я заставил его работать для меня.
TL; DR;Начнем с быстрой настройки.
Установить Sublime Text
- Скачайте Sublime Text с их официальной страницы.
- Установите его.
- Прибыль.
После того, как вы установили основной текстовый редактор, у вас уже должен быть широкий диапазон доступных опций, от создания фрагментов кода до настроек ярлыков и настроек профиля.
Это достаточно хорошее начало, и вы будете чувствовать себя комфортно, используя его как есть, но есть улучшения, которые необходимо внести.
Sublime Text полагается на пакеты для расширения своей функциональности. Когда пакеты выбираются и настраиваются с умом, он становится больше похож на IDE без лагов, но также без отлова ошибок перед компиляцией.
Пакетный контрольЧтобы иметь возможность легко устанавливать пакеты, вам понадобится так называемый Package Control. Чтобы установить его, следуйте инструкциям здесь.
После установки вы сможете вызвать панель, нажав
ctrl + shift + p
в Linux и Windows иcmd + shift + p
в OS X.Мы будем использовать эту панель для установки всех остальных пакетов.
Следующий раздел посвящен ускорению написания кода с использованием плагинов, таких как Emmet.
ЭмметЧтобы установить Emmet, запросите панель, как указано выше, нажав
ctrl + shift + p
и набрав Install Package . Первый элемент в списке — это Package Control: Install Package . Нажмите на нее, подождите секунду или около того, и появится новая панель. Введите Emmet и выберите первый.Поздравляем! Но что вы только что установили?
Emmet — это набор ярлыков и сниппетов, позволяющий быстро писать код HTML и CSS.
Например:
В документе HTML введите
!
и нажмите вкладку. Это сгенерирует весь шаблон HTML5. Или попробуйтеul> li * 5> a.nav
и нажмите вкладку. Он генерирует список из 5 элементов, каждый из которых содержит ссылку с классом nav .Вы можете установить расширения emmet, если хотите, чтобы включить больше фрагментов или ярлыков. Для этого повторите процедуру установки пакета, напишите Emmet в новом запросе и посмотрите, что там доступно.Если есть что-то, что может вам подойти, установите это.
PHP Companion (только для разработчиков PHP)Опять же, начните с знакомой комбинации
ctrl + shift + p
и Install Package, затем найдите PHP Companion . Отлично. Теперь, когда он установлен, перейдите к Preferences -> Key Bindings . Это покажет вам два файла, один слева должен быть заполнен настройками по умолчанию, это Sublime Default Key Bindings .Справа вы увидите Пользовательские привязки клавиш .Это пример того, как вы можете настроить свои собственные команды. Проверьте это для получения более подробной информации.
[ {"ключи": ["f6"], "команда": "expand_fqcn"}, {"keys": ["shift + f6"], "command": "expand_fqcn", "args": {"leading_separator": true}}, {"ключи": ["f5"], "команда": "find_use"}, {"ключи": ["f4"], "команда": "import_namespace"}, {"ключи": ["f3"], "команда": "реализовать"}, {"keys": ["shift + f12"], "command": "goto_definition_scope"}, {"ключи": ["f7"], "команда": "insert_php_constructor_property"} ]
Вставьте этот код в свой Пользовательский файл (файл справа).Сохраните изменения, затем перезапустите редактор Sublime Text.
То, что делает PHP Companion, использует ярлыки, такие как f5 и f6, чтобы найти пространство имен класса и автоматически встроить его (f5) или импортировать его в начало файла (f6).
Для ООП и разработки с использованием фреймворков, основанных на классах и пространствах имен, PHP Companion — огромный прирост производительности.
Красота Код«Любой дурак может написать код, понятный компьютеру.Хорошие программисты пишут код, понятный людям »- Мартин Фаулер, 2008.
Принимая приведенную выше цитату такой, какая она есть, по правде говоря, нам нужно писать хороший, хорошо отформатированный, читаемый и понятный код. В конце концов, единственная реальная мера качества кода — это WTF в минуту.
Тем не менее, давайте перейдем к пакетам, которые сделают это проще.
DocBlockrЭто простой плагин.После установки вы можете перейти к любому файлу, набрать
/ **
, а затем быстро нажать Tab.Это должно сгенерировать секцию комментариев блока, подобную показанной ниже.
/ ** * [описание вашего метода] * @param [тип] $ параметр [описание] * @return [тип] [описание] * /
Как видите, он автоматически заполняет имена и типы параметров (если они обнаруживаются) и тип возвращаемого значения функции.
Документация — номер один для написания хорошего кода, и этот плагин значительно упрощает работу с ней.
ВыравниваниеПредположим, у вас есть следующий код:
$ яблоко = «яблоко»; $ pear = «груша»; $ banana = «банан»;
Вы можете выделить их все сразу, нажмите
ctrl + alt + a
, и вы получите:$ apple = "яблоко"; $ pear = "груша"; $ banana = "банан";
Это особенно полезно, когда у вас есть огромные массивы, содержащие много одиночных пар
Код коррекцииключ => значение
, и вы хотите упростить чтение / редактирование.Имея в виду, что Sublime text не является IDE, полезные подсказки, такие как синтаксические ошибки для пользовательских классов или переменных, получить нелегко. Тем не менее, у нас все еще могут быть помощники, которые сообщают нам, если точка с запятой отсутствует или круглые скобки не закрыты, или о подобных проблемах, прежде чем мы откроем браузер, чтобы протестировать его самостоятельно.
Sublime LinterSublime Linter — это базовый пакет, который обеспечивает немедленную проверку синтаксических ошибок для Python, JS, CSS и Ruby.
После установки он должен работать сразу. Попробуйте сами: откройте файл .js, сделайте синтаксическую ошибку, и вы увидите красную точку слева рядом с номером строки.
Для языков, которые не доступны автоматически с Sublime Linter, все, что нам нужно сделать, это установить дополнительные пакеты, еще раз запросив панель. Выполните
ctrl + shift + p
, введите Install Package и, наконец, Sublime Linter , затем выберите язык по выбору, например, PHP .Надеюсь, эта статья оказалась для вас полезной! У вас есть любимые пакеты, которые облегчат вам жизнь при программировании? Поделитесь этим в комментариях ниже.
Наем преданных разработчиков PHP? Посетите наше Сообщество разработчиков PHP.
Основные сведения
В. Является ли Sublime Text бесплатным?
Sublime Text можно загрузить и установить бесплатно, но для дальнейшего использования необходимо приобрести лицензию. Ограничений по времени для оценки нет.
Q: Нужна ли мне лицензия на Sublime Text?
Для покупки Sublime нет никаких юридических требований. Вы можете использовать неограниченный оценочный период, но для продолжения использования необходимо приобрести лицензию.
Sublime Text 3 пакетов для базовой разработки PHP | Drupart
Sublime Text 3 имеет отличные пакеты для всех видов вещей, и в этом сообщении в блоге я напишу о пакетах, которые делают меня счастливым при использовании для веб-разработки. Итак, начнем!
Управление пакетамиПерво-наперво, нам нужно установить Package Control для установки других пакетов.Чтобы установить управление пакетами, мы открываем палитру команд, чтобы открыть ее, перейдите в Инструменты-> Палитра команд или с помощью сочетания клавиш Shift + Ctrl + P в Linux.
Вот изображение:
, теперь мы можем устанавливать другие пакеты с помощью Package Control. Вы можете искать и устанавливать другие пакеты по имени, открыв палитру команд и набрав Install Package, а затем просто введите имя пакета, который хотите установить. Также мы можем просматривать пакеты на https://packagecontrol.io, и вы можете читать документацию, использование и конфигурацию пакетов.
PHPFMTПервый пакет, который я устанавливаю после Package Control, — это phpfmt. Эти пакеты необходимы разработчикам PHP. С помощью PHPFMT вы можете форматировать свой код при сохранении файла, чтобы установить пакеты с помощью управления пакетами, нажмите Shift + Ctrl + P, чтобы открыть панель команд, введите « установить », затем введите имя пакета, который вы можете установить, в нашем случае это это phpfmt.
Прежде чем мы сможем использовать этот пакет, мы должны определить путь к двоичному файлу php.Откройте настройки конфигурации Preferences-> Package Settings-> phpfmt-> Settings — User. Внимание! никогда не изменять Settin_gs — файл по умолчанию, так как изменения будут потеряны после обновления Sublime.
Укажите php_bin для расположения двоичного файла php и не забудьте установить
format_on_save в true и потом обо всем этом можно забыть, так как это
автоматически отформатирует ваш php-код.
SublimeLinterSublimeLinter PHP (и его необходимая зависимость SublimeLinter) полагаются на встроенный линтер PHP.Это более простая версия, которая запускает только линтер, и ничего больше. Это проверка ошибок в вашем PHP-коде. Установите его так же, как вы установили phpfmt.
GitGutter
GitGutter показывает вам git diff на Sublime. изменено или удалено, обновлено?
Усовершенствования боковой панелиSideBarEnhancements, как следует из названия, расширяет боковую панель Sublime.
SFTPОтличный пакет, позволяющий очень удобно использовать SFTP, FTP и FTPS.Он поддерживает просмотр удаленных папок, редактирование и синхронизацию между локальными и удаленными файлами. Также регулярная загрузка, загрузка, сохранение или открытие файла.
js ПреттьеЭтот пакет не для php, но я использую его при работе с файлами javascript. Этот пакет, как и phpfmt, форматирует код javascript. Перед использованием этого пакета мы должны установить более красивую установку зависимостей с помощью этой команды
npm install -g красивее
Затем установите пакет jsPrettier и откройте файл настроек, как мы открывали на phpfmt.В качестве примера конфиг:
{ "отладка": ложь, "prettier_cli_path": "/home/tasqyn/.asdf/installs/nodejs/9.2.0/.npm/bin/prettier", "путь_узла": "/home/tasqyn/.asdf/shims/node", "auto_format_on_save": правда, "auto_format_on_save_excludes": ["* / node_modules / *"], "allow_inline_formatting": правда, "custom_file_extensions": [], "max_file_size_limit": -1, "additional_cli_args": {}, "prettier_options": { "printWidth": 100, "singleQuote": ложь, "trailingComma": "нет", "bracketSpacing": истина, "jsxBracketSameLine": ложь, "парсер": "вавилон", "полу": правда, "requirePragma": ложь, "proseWrap": правда } }
prettier_cli_path — путь к красивее.
node_path — путь к узлу
Вы можете изменить настройки в соответствии с вашими потребностями.
ЗаключениеЭто пакеты, которые я использую все время. Конечно, есть много пакетов для Sublime Text 3, вы можете просмотреть их на packagecontrol.io и выбрать свои любимые.
Это мой первый такой пост в блоге, так что здесь много ошибок, не стесняйтесь указывать на это.
Спасибо за внимание!
12 плагинов, которые делают Sublime Text 2 лучшим редактором кода PHP
Sublime Text 2 — фантастический редактор кода, но изначально он довольно ограничен в функциональности PHP IDE.Для Sublime Text 2 доступно множество плагинов, которые делают его в большей степени IDE и, на мой взгляд, лучшим редактором, доступным для разработки PHP. Вот 12 моих лучших плагинов, которые расширяют набор функций Sublime Text 2 и делают его моим лучшим выбором для PHP IDE.
1: Управление пакетами
Package Control — замечательный плагин, разработанный Уиллом Бондом, который позволяет вам легко искать, устанавливать, управлять, удалять и обновлять другие пакеты. В Package Control добавлено красивое меню для простого управления вашими пакетами.Это, безусловно, самый важный плагин, поскольку он позволяет легко добавлять и управлять другими плагинами.
2: возвышенный код Intel
Sublime Code Intel добавляет функциональность IDE в Sublime Text и добавляет автозаполнение для доступных модулей, символов, функций и методов, как и должно быть в настоящей IDE. Он также добавляет возможность перехода к определению функции или метода, если оно определено вне текущего файла. Он также добавляет отрывок о текущем методе в строке состояния ST2.
3: Sublime Linter
Sublime Linter — чрезвычайно удобный плагин, который быстро и автоматически обнаруживает синтаксические ошибки в вашем коде. Помимо встроенного PHP-линтера, плагин также имеет линтеры для C / C ++, CoffeeScript, CSS, Git Commit Messages, Haml, HTML, Java, JavaScript, Lua, Objective-J, Perl, Puppet, Python, Ruby и XML.
4: WordHighlight
Word Highlight — отличный плагин для Sublime Text 2, который выделяет все вхождения в текущей строке.Просто дважды щелкните строку, и Word Highlight сделает все остальное. Выделенные слова увидеть намного быстрее, чем при поиске. Плагин также добавляет точку к желобу для облегчения идентификации при прокрутке или для скрытых в поле зрения экземпляров строки. Цветовая гамма полностью настраивается.
5: DocBlockr
DocBlockr — это плагин ST2, который автоматически заполняет ваши блоки документов. Все, что вам нужно сделать, это запустить блок документов с помощью / ** и нажать Enter, чтобы завершить его.DocBlockr также включает фрагменты для добавления документации в блок документов, ускоряющие и стандартизирующие блоки документов.
6: Возвышенное выравнивание
Will Bond снова приходит на помощь с простым, но очень полезным плагином, который автоматизирует выравнивание специальных символов в выделении. Это очень полезно для выравнивания символов «=» в присвоении переменных или символов «=>» в определениях массивов. Это избавляет от лишних затрат времени на написание чистого кода и делает вашу работу более продуктивной.
7: Улучшения боковой панели
Стандартная боковая панель ST2 довольно ограничена и не работает как проводник Windows или Mac Finder с меню параметров для выполнения задач. Улучшения боковой панели добавляют операции, которые можно выполнять с элементами проводника файлов боковой панели, такие как удаление, копирование, переименование и многие стандартные операции, которые мы ожидаем от проводника файлов.
8: FileDiffs
Хотите узнать, какая строка кода изменилась между двумя версиями одного и того же файла? FileDiffs — это простой, но мощный инструмент, который позволяет вам видеть только различия между двумя файлами.Сравните открытые файлы, пути к файлам или даже буфер обмена.
9: Git
Раздражены командами командной строки для управления версиями или просто отвратительно переключаться в командную строку исключительно для проверки последних обновлений репозитория? Плагин Git добавляет команды Git прямо в Sublime Text, поэтому вам не нужно использовать командную строку для выполнения операций контроля версий.
10: Возвышенный SVN
Плагин SVN добавляет в Sublime Text функцию контроля версий SVN.Это связано с небольшими затратами, но оно того стоит, если вы активно пользуетесь SVN.
11: возвышенный SFTP
ПлагинSublime SFTP позволяет быстро загружать, скачивать или синхронизировать файлы с помощью FTP или SFTP. Это позволяет быстро синхронизировать удаленные файлы для тех, кто использует FTP-сервер. Это также имеет небольшую стоимость, но опять же очень полезно, если вы часто используете FTP и хотите сэкономить время и энергию при переключении между FTP-клиентом и ST2.
12: Soda Theme
Пакет Soda Theme добавляет в Sublime Text улучшения темных и светлых тем. Это добавляет больше, чем просто цвета текста и цвет фона, он также обновляет стили вкладок, стили боковой панели и имеет поддержку Retina для обновления полного внешнего вида Sublime Text 2.
18 лучших текстовых пакетов для веб-разработчиков
Редакторы кода для дизайнеров / разработчиков в этом нет недостатка.Но всегда будет программное обеспечение, которое будет выделяться среди остальных, и на рынке редакторов кода это Sublime Text — наиболее широко и целенаправленно используемый редактор кода в мире, который помог десяткам миллионов программистов. стать полноценными разработчиками и дизайнерами сайтов. Магия Sublime Text заключается в его гибкости и возможности расширять редактор кода с помощью пользовательских пакетов и плагинов.
Используя правильные пакеты, можно создать среду Sublime Text, отражающую полностью всеобъемлющую среду сборки, тестирования и запуска, которая не только повышает производительность, но и повышает качество кода / программного обеспечения, которое вы создаете.Sublime Text предлагает полностью дружественную среду разработки для тех, кто много работает с языками внутреннего и внешнего программирования. Front-end разработчики без ума от Sublime, и вы найдете их страсть бесценной для вашего обучения.
Что сделало Sublime Text отличным от любого другого редактора кода на рынке, так это интеграция диспетчера пакетов, который можно использовать для добавления настраиваемых плагинов и настраиваемых тем Sublime Text для персонализации процесса кодирования. Это привело к разработке тысяч уникальных плагинов Sublime, которые добавляют самые универсальные функции в вашу среду разработки.Некоторые плагины были загружены более миллиона раз, что свидетельствует об их большом успехе в превращении Sublime Text в лучший редактор кода на планете. Мы будем демонстрировать только лучшие плагины Sublime Text как для версии 2, так и для версии 3. Мы постарались включить как можно больше разнообразия, чтобы эти плагины использовались как интерфейсными, так и внутренними разработчиками. Делитесь своими в комментариях!
Управление пакетами
Package Control — это то, что заставляет все остальное работать из этого списка, поэтому вам нужно будет загрузить и активировать его для вашей установки Sublime Text.Это ваш маленький центральный плагин для Sublime. Он дает вам доступ к простому модулю, который позволяет загружать, устанавливать и активировать все виды плагинов Sublime, но также поддерживает общие задачи разработчика и помогает иметь больше времени, чтобы сосредоточиться на кодировании. На сегодняшний день более семи миллионов пользователей установили Package Control, что указывает на огромную популярность диспетчера пакетов Sublime и является свидетельством того, как проект с открытым исходным кодом может помочь миллионам пользователей за счет пожертвований от них. кто использует платформу, действительно невероятная работа.
СкачатьМатериализованные фрагменты CSS
Materialize — это огромный интерфейсный фреймворк для разработки современного и гибкого дизайна с использованием стандартов материального дизайна. Плагин Materialized для Sublime предоставляет вам компоненты CSS прямо в ваш редактор, так что вы можете мгновенно получить к ним доступ с помощью основных команд. Это сэкономит вам огромное количество времени и энергии, которые в противном случае ушли бы на поиск синтаксиса вручную, что является еще одним фактором, важным для редакторов кода, таких как Sublime — чем больше вы используете пакеты, тем легче становится понять, как определенные библиотеки и даже языки программирования работают, и как вы можете лучше понять использование определенного синтаксиса.
СкачатьСтандартный формат
Форматирование всегда будет важно для программистов не только для того, чтобы помочь себе создать более прочную кодовую базу, но и для того, чтобы помочь любому, кто собирается прикоснуться к вашему коду, улучшить навигационный доступ по вашему коду. Плагин StandardFormat возьмет известную библиотеку Standard Format JS, а затем выполнит ее в соответствии с вашим написанным кодом, чтобы преобразовать ваш код в код традиционного стандартного формата JS. Очень быстро приступить к работе, и результаты ошеломляют.
СкачатьТерминал
Все сводится к производительности. Плагины Sublime Text предназначены для экономии вашего времени. Предоставляя вам инструменты и функции, которые сделают вашу среду разработки намного более плавной, более гибкой и, безусловно, удобной для использования. Терминал — одна из тех библиотек, которые, по вашему мнению, вам не нужны, пока вы не начнете его использовать. Что делает пакет / плагин, он создает ярлыки и пункты меню, которые можно использовать для открытия вашего Терминала в позиции файла, который вы редактируете в данный момент, или вы можете быстро перейти к корневой папке, в которой находится ваш проект, также в терминал конечно.Это простой пакет с простой функциональностью, но он каким-то образом облегчает жизнь уже более чем 220 000 человек. Ты один из них?
СкачатьХайлайтер Laravel Blade
Вы, возможно, были разработчиком PHP в прошлом, но вам надоел язык и вы решили попробовать что-то новое … ну, прежде чем вы решите, что закончили с PHP навсегда, возможно, вам стоит попробовать Laravel, потрясающий открытый — исходный фреймворк PHP, который изменил ландшафт PHP и общей разработки PHP.Без сомнения, одна из самых популярных фреймворков десятилетия, вся представленная сообществу одним разработчиком, у которого было видение создания чего-то уникального, и это видение было реализовано довольно быстро, само собой разумеется. Laravel использует так называемый Blade Engine, особый синтаксис, который поддерживает разработку нового программного обеспечения поверх фреймворка, откровенно говоря … трудно представить кодирование Laravel на Sublime без помощи этого плагина, и 120 000 человек согласятся со мной. что.
СкачатьПростые задачи
Они говорят, что действительно успешные люди используют списки, чтобы управлять своей жизнью и целями, которых они хотят достичь.В некотором смысле это утверждение верно, списки действительно помогают нам управлять нашими целями и проектами и дают краткое представление о том, где мы стоим по той или иной конкретной проблеме. Вот для чего хороши списки, чтобы иметь график того, что мы пытаемся сделать. PlainTasks позволяет создавать список дел непосредственно в редакторе Sublime. Вы можете быстро оценить и создать дорожную карту для своего проекта, дав себе необходимое понимание того, что вы пытаетесь построить, и, поскольку это делается в Sublime, вы всегда можете перейти к нему, чтобы прочитать, что еще нужно быть сделано, или перечеркнуть то, что уже было сделано.
Скачатьj Запрос
Мы в Colorlib любим jQuery. У нас есть сильная страсть к jQuery, и наши прошлые публикации, основанные на этой теме, должны быть достаточным доказательством этого: см. Здесь, здесь и здесь. Мы очень рады и счастливы продвигать плагин jQuery для пользователей Sublime Text, плагин, которым активно пользуются и используют более 500 000 разработчиков. jQuery — это язык Интернета, он делает Интернет более интерактивным и дружелюбным для пользователя.
Плагин jQuery для Sublime интуитивно понимает, что вы пытаетесь запрограммировать, и дает вам подсказки, подсказки, подсказки и функции автозаполнения всякий раз, когда вы пишете новый код jQuery.В свою очередь, уровень вашей продуктивности резко возрастет благодаря возможности писать код, не обращаясь к документации каждые пять минут. Это особенно касается проектов, требующих большого количества кода и управления. Бесценно иметь плагин, который сделает всю тяжелую работу за вас, и всего за несколько часов использования этого плагина становится ясно — эти плагины спасают жизнь (продуктивность)!
СкачатьSass
SASS — это препроцессор, который вам нужно изучить! Если вы хотите по-новому взглянуть на программирование CSS, полезно изучить препроцессор, который может легко преобразовать язык сценариев в реальный функциональный язык программирования, где вам не нужно повторно использовать один и тот же синтаксис и шаблоны каждые десять секунд.SASS просто позволяет невероятно легко «программировать» с помощью CSS и рассматривать CSS как функциональную альтернативу. Во всяком случае, плагин SASS уже скачали почти 480 000 раз. Этот невероятно универсальный плагин добавит функциональность SASS в ваш рабочий процесс Sublime, что позволит вам использовать Sass более эффективно и с большей точностью.
СкачатьПалитра цветов
Забудьте о том, чтобы каждые несколько минут возвращаться в Интернет, чтобы найти нужный вам цвет. Вся эта тяжелая работа должна выполняться прямо в вашем редакторе или, как сказали бы разработчики интерфейса: в вашем браузере.ColorPicker придаст вашему редактору Sublime Text дополнительную функциональность, которая даст вам простой способ выбора правильных цветов для всего, что вы пытаетесь стилизовать в данный момент. ColorPicker работает на всех платформах, и его проще использовать, чем научиться говорить Hello World на Haskell!
СкачатьМЕНЬШЕ
LESS — еще один препроцессор, за которым стоит солидное сообщество последователей. Плагин под рукой будет выполнять автозаполнение и подсветку синтаксиса для любых файлов проекта, которые были созданы с использованием LESS.Этот плагин с более чем 370000 активными установками удобно входит в число лучших плагинов Sublime Text, которые когда-либо были выпущены.
СкачатьФормат Js
JS Beautifier снова делает ваш код JavaScript красивым! Так устроено в кругах разработчиков. Код нужно оптимизировать и хорошо оптимизировать. JsFormat — это плагин Sublime, который работает с форматированием вашего кода JavaScript с помощью библиотеки JS Beautifer.
СкачатьКронштейн Highlighter
Отсюда и название, Bracket Highlighter — это инструмент с возвышенным текстом, который помогает выделять скобки и теги.Несмотря на то, что он существует уже несколько лет, автор полностью переписал код, сделав Bracket Highlighter более гибким и практичным, чтобы вы могли с легкостью получить от него максимальную отдачу. Излишне говорить, что есть множество функций и функций, которые вам подойдут. Он работает с множественным выбором, поставляется с отличными функциями настройки, поддерживает пользовательские значки желоба и режим выхода скобы для переключения скал. Вы также получите полное руководство по установке и можете прочитать остальную документацию, чтобы понять ее суть.СкачатьАнаконда
Anaconda — отличное решение, которое безупречно работает прямо из коробки, если вы хотите превратить Sublime Text 3 в полнофункциональную среду разработки Python. Конечно, он поставляется с различными практическими опциями и функциями, которые вам могут пригодиться. Другими словами, вы можете настраивать вещи и изменять Anaconda в соответствии со своим вкусом и правилами. Несмотря на то, что вы можете использовать инструмент как есть, настоятельно рекомендуется ознакомиться с конфигурациями, так как производительность будет работать в ваших интересах гораздо более плавно.И если вы разработчик, желающий внести свой вклад в Anaconda, вы тоже можете это сделать. СкачатьЗначок файла
Если вы хотите улучшить работу с Sublime Text, сделав его более привлекательным для глаз, вам подойдет значок файла. Это расширение, которое добавляет в Sublime Text значки, относящиеся к конкретным файлам, для более удобного поиска данных. Хотя вы можете использовать доступные значки точно так, как они предопределены, вы также можете изменять и редактировать их. Вы можете изменить цвет, размер значков и уровень прозрачности, чтобы результат точно соответствовал вашему стилю.Вы найдете все подробности, информацию об установке, устранении неполадок и другую информацию в онлайн-документации, которая обеспечивает простоту использования как для новичков, так и для экспертов. СкачатьВсе автозаполнение
Если есть одна функция, с которой может согласиться каждый разработчик, она неоценима для редакторов кода, таких как Sublime, то она будет автозаполнена. С автозаполнением мы можем легко изменить имена функций или добавить новый синтаксис, не беспокоясь о том, что нам придется повторять одно и то же действие снова и снова, нет.. автозаполнение позаботится обо всем этом! И этот плагин All Autocomplete для редактора Sublime Text потрясет ваш мир, когда дело доходит до автозаполнения кода с использованием интуитивно понятного интерфейса. Этот плагин расширяет вашу функцию автозаполнения по умолчанию для поиска совпадающего синтаксиса во всех открытых файлах проекта.
СкачатьHTML-CSS-JS Prettify
Очень важно правильно указать код! Это помогает согласовать код для использования в будущем для всех, кто хочет исследовать и развивать ваши идеи.Это приложение работает, в частности, с форматами кода HTML5, CSS3, JavaScript и JSON. Все обрабатывается через Node.js!
СкачатьWord Press
Конечно, как мы можем забыть разработчиков WordPress? Есть актуальный пакет для тех из вас, кто активно работает с WordPress. Sublime Text работает таким образом, что вы можете установить столько плагинов, сколько захотите. Об этом нужно помнить. Они начнут работать только тогда, когда вы начнете использовать код, поддерживающий назначение плагинов.Здесь у нас также есть плагин WordPress. Это модуль, который поможет в написании синтаксиса, связанного с WordPress, для связанных с WordPress проектов, над которыми вы работаете. Выведите свой WP на новый уровень!
СкачатьJava Script Next — синтаксис ES6
ВышелECMAScript 2016, и все в восторге от этого! Браузеры уже работают над интеграцией ES7. А пока давайте немного отдышимся и сосредоточимся на том, что здесь доступно для непосредственного использования.Если вы все еще испытываете трудности с изучением синтаксиса ES6, вам нужно скачать копию JavaScriptNext. Разработчики специально создали плагин Sublime для автозаполнения и помощи с подсветкой синтаксиса ES6.
СкачатьВавилон
Однако вы можете быть поклонником Babel, который также поддерживает синтаксис ES6. В этом случае вам просто нужно взять копию плагина Babel и таким образом выполнить программирование на ES6. Удачного кодирования, что бы вы ни решили делать!
СкачатьЛучший редактор кода для серьезного разработчика
УспехSublime основан не на маркетинге.Это чистая привлекательность, которую разработчики нашли в дизайне и функциональной палитре, которую Sublime так легко реализует. Расширяемый с помощью плагинов и пользовательских тем, вы можете эффективно настроить Sublime в соответствии с потребностями любого разработчика. Вы также можете включить его современные фреймворки и их синтаксис в свой рабочий процесс Sublime. Вам больше не нужно проверять документацию. Более того, никто не может сравниться с производительными функциями Sublime, кто все равно захочет соревноваться? Миллионы людей посвятили свою работу Sublime.Изучение нового редактора кода потребует много времени и, скорее всего, в любом случае будет провальным приключением.
.