Настройка саблайм текст 3 – Прокачай Sublime Text 3 (2018). Топ 55 плагинов + тема + русик и словарь.

Содержание

Быстрая настройка Sublime Text 3 для вёрстки сайтов

 

Скачать дистрибутив Sublime Text 3:   http://www.sublimetext.com/

 

По умолчанию Sublime Text — выглядит печально 😥

 

 

Поэтому установим все необходимые плагины.

 

Настроим  Package Control

 

Нажимаем:  Ctrl + Shift + P

 

На MAC другое сочетание клавиш, возможно  Cmd + Shift + P

 

 

Жмем  Enter  и устанавливаем  Package Control

 

Package Control необходим для того, что бы можно было устанавливать необходимые пакеты и плагины для  Sublime Text

 

После установки   Package Control — установим все необходимые плагины.

 

 

Emmit — нужен для того, что бы максимально быстро писать  html и  css  код ;

Установим Emmit

Нажимаем: 

Ctrl + Shift + P

 

Имеем список доступных пакетов (серый список)

 

И судя по сообщению — установка  Emmet  завершена!

 

 


Следующий плагин который установим:  AutoFileName

 

 

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

Для установки нажимаем: Нажимаем:  Ctrl + Shift + P

 

И в появившемся списке пакетов — набираем в строке:  AutoFileName

 


 

Следующий плагин который установим: Gist

Гисты — это кусочки кода, которые хранятся на gist.github.com.

Причем эти кусочки кода можно прямо из Sublimetex — извлечь с gist.github.com.

 

 

Для установки нажимаем: Нажимаем:   Ctrl + Shift + P

 

 

Установили Gist!

Рекомендуется посмотреть видео по настройке Gist

 


 

СЛЕДУЮЩИЙ ПЛАГИН: SASS

 

 

 

Важно!

 

НЕ ЗАБЫВАЕМ УСТАНОВИТЬ    Gulp sass   в   Terminal 

 

Командой:     npm i gulp-sass --save-dev  

 

 

 

 

    Да ХРЕН ТАМ! — НЕ БУДЕТ РАБОТАТЬ!    

 

Еще необходимо доставить еще пакет:

 

 

Скрина нет) Так как уже поставил — а 2 раза установщик не показывает.

 

 

Теперь установим Внешнее оформление Sublime Text

 

 

     Начали:     

 

 

и  2 варианта  цветовых оформления на выбор:

 

 

Далее переходим собственно к настройке Sublime Text 3

 

 

Отrроется файл настроек Sublime Text3

 

Правим настройки прям в этом же файле и нажимаем  Ctrl + S 

 

Ссылка на статью с настройками Sublime Text

 

Однако, при простом копировании настроек из статьи по ссылке — может возникать ошибка — МОл, не может найти тему One Dark!

 

Проблема решилась — выбором нашей темы   «One Dark..» 

 

напрямую через меню Sublime Text3:

 

 

    Порядок! Продолжаем настройку :   

 

 

Включить отображение непечатных символов:

 

нужно добавить строку в пользовательский файл настроек Sublime Text → Preferences → Settings — User.

Допишем код ЧЕРЕЗ ЗАПЯТУЮ в наш файл настроек:

   "draw_white_space": "all"    //Показать все символы  

 

 

 

Меню выключили — но можно его оперативно включать.

 

 

Установка темы One Dark на MAC

 

Выполняем стандартную установку в   Sublime Text 3   через комбинацию клавиш    Cmd + Shift + P 

 

 

1) Ставим:   Theme — One Dark 

 

2) Ставим:    One Dark — Color Scheme 

 

Но потом, скорее всего произойдет сбой ТЕМЫ!

 

Что бы это исправить — идем как на картинке:

 

SumbLime Text  ->   Preferences  ->    Color Scheme... 

 

   И вуаля! Тема One Dark у нас встала!

 

Установка  темы на MAC — Завершена!

 

Далее — откроем настройки клавиатуры:

 

Preferences →  Key Bindings   (Сочетания клавиш)

 

 

Далее переходим к Гисту:

 

GitHub Gist

 

Ссылка на статью с настройками Sublime Text

 

 

и вставляем ее сюда — в правую вкладку:

 

 

{ "keys": ["alt+shift+f"], "command": "reindent" },

 

 

 

 

Далее — откроем настройки клавиатуры Sublime Text3 на MAC:

 

Preferences   →    Key Bindings    (Сочетания клавиш)

 

 

В открывшееся правое окно (документ)  —  вставляем строчку (см. инструкцию Windows):

 

   И вуаля — все работает!  

 

А точнее — выполняется Выравнивание строк кода!

Важно, обязательно оставить квадратные скобки — иначе ошибка будет и не будет работать.

 

    Выравнивание на MAC — РАБОТАЕТ!  

 

 

Далее настраиваем:

 

 

и откроется папка   Packages 

 

 

Эта папка нужна для быстрого переноса настроек — на другое рабочее место.

 

Просто копируем все содержимое этой папки  Packages 

 

Или же можно сохранить только отдельные настройки из папки   User 

 

 

 

Включение боковой панели  Sidebar 

 

 

 

Можно приступать к работе по верстке сайтов!

 

 

 

 

И пропишем строку в конец файла,

 

ВАЖНО поставить ЗАПЯТУЮ после предыдущего параметра:

 

<span>»draw_white_space»: «all»</span> // показывать все символы

<span>»draw_white_space»: «all»</span> // показывать все символы

 

 

 

       Изменить шрифт в Sublime Text 3     

 

 

 

Пропишем нужный нам шрифт:

 

     "font_face": "Courier New",   

 

 

Установим еще дополнение для быстрого просмотра цвета:

 

Вызовем установщик:       Ctrl + Shift + P  

 

 

 

    ГОТОВО!  

 

Можно настроить — с какой стороны подсвечивать квадратик.

 

 

 

Включить «Черную (Темную)» тему для   «Side Bar» 

 

 

И выбрать:

 

 

    Настройка переносов длинных строк:  

 

 

 

 

 

 

Sublime Text 3 для web разработки — Статьи

Sublime Text 3 — это «продвинутый» блокнот для написания кода. Sublime Text имеет много плюсов, которые выделяют его среди других «продвинутых» блокнотов (например Notepad++). Он прост в использовании, выглядит очень стильно, имеет минималистичный интерфейс (минимум визуального шума) и кучу плагинов, расширяющих его функционал.

В этой стать будет подборка плагинов для Sublime Text 3, которые помогают нам в работе. Так же будут представлены некоторые настройки самого редактора и плагинов. Для начала скачиваем редактор с официального сайта. Желательно скачивать портабельную версию.

Как же настроить данный редактор под себя? А все очень просто, настройки sublime хранит в обычных текстовых файлах в меню «Preferences». Обычно файл «Settings — Default» хранит настройки по умолчанию, а «Settings — User» содержит пользовательские настройки. Механизм очень простой, просто настройки «User» перебивают настройки «Default», вот и вся магия. Сам же файл «Default» даже не пробуйте править, все равно редактор этого не позволит. За то он позволит скопировать какие-либо настройки, для того чтобы не заниматься рутинным перепечатыванием из одного файла в другой.

Ниже представлен листинг моего файла настроек.

{
	"afn_insert_dimensions": false,
	"always_show_minimap_viewport": true,
	"auto_close_tags": false,
	"auto_match_enabled": true,
	"bold_folder_labels": true,
	"enable_tab_scrolling": false,
	"fade_fold_buttons": false,
	"font_size": 11,
	"highlight_line": true,
	"highlight_modified_tabs": true,
	"open_files_in_new_window": false,
	"overlay_scroll_bars": "enabled",
	"save_on_focus_lost": false,
	"trim_automatic_white_space": false,
	"word_wrap": true
}

Расписывать каждую настройку не стану, скажу лишь, что по ходу этой статьи мы его немного дополним.

Стандартные горячие клавиши меня не сильно устроили и поэтому я решил их немного подкорректировать под себя. Ниже представлен листинг моих горячих клавиш. Доступ к файлу можно получить из меню «Preferences -> Key Binding — User»

[
	// Скрывает панель навигации по файлам
	{"keys": ["ctrl+shift+s"], "command": "toggle_side_bar" },
	// Скрывает миникарту
	{"keys": ["alt+ctrl+shift+s"], "command": "toggle_minimap" },
	// Форматирует отступы в выделенном коде
	{"keys": ["alt+shift+f"], "command": "reindent" },
	// Дублирует строку
	{ "keys": ["ctrl+d"], "command": "duplicate_line" },
	// Выделяет одинаковые слова 
	{ "keys": ["ctrl+shift+d"], "command": "find_under_expand" },
	// Быстрое создание нового файла
	{ "keys": ["ctrl+shift+n"], "command": "advanced_new_file_new"},
	// Выделение целой строки
	{ "keys": ["ctrl+l"], "command": "expand_selection", "args": {"to": "line"} },
	// Удалить целую строку
	{ "keys": ["ctrl+shift+l"], "command": "run_macro_file", "args": {"file": "res://Packages/Default/Delete Line.sublime-macro"} },
	// Добавить пустую строку под курсором
	{ "keys": ["ctrl+enter"], "command": "run_macro_file", "args": {"file": "res://Packages/Default/Add Line.sublime-macro"} },
	// Добавить пустую строку над курсором
	{ "keys": ["ctrl+shift+enter"], "command": "run_macro_file", "args": {"file": "res://Packages/Default/Add Line Before.sublime-macro"} },
	// Меню замены
	{ "keys": ["ctrl+r"], "command": "show_panel", "args": {"panel": "replace", "reverse": false} },
	// Панель нечеткого поиска @
	{ "keys": ["ctrl+h"], "command": "show_overlay", "args": {"overlay": "goto", "text": "@"} },
	// Сохранение всех файлов
	{ "keys": ["ctrl+s"], "command": "save_all" },
	// Сохранение только текущего файла
	{ "keys": ["alt+s"], "command": "save" },
]

И этот файл мы немного допишем, а именно в этой статье мы сделаем 2 очень удобных макроса для console.log() и повесим их на сотетания клавишь alt+c и alt+v. А все горячие клавиши можно посмотреть тут «Preferences -> Key Binding — Default»

Важное замечание: Чтобы заработали хоткеи для навигации по файлам и миникарте, нужно сперва включить их в меню «View -> Side Bar -> Hide Side Bar» и «View -> Hide Minimap» соответственно.

Так же меня не устроила тема по умолчанию. Сильно выраженный красный цвет в коде резал мне глаза. И я решил её немгного перекрасить) В это мне помог сервис. Можно настроить любую из стандартных тем под свои вкусы. Мой вариант можно скачать по ссылке — моя тема. Далее этот файл можно сохранить и поместить в «…Sublime Text 3\Data\Packages\User», зайти в эту папку можно выбрав в меню «Preferences» первый пункт «Browse Packages», откроется проводник и в нем нужно зайти в папку «User». Потом нужно активировать нашу новую тему. Для этого в меню «Preferences -> Color scheme -> User -> /Наша новая схема/». Так же можно зайти в настройки «Preferences -> Settings — User» и прописать там вот такую настройку:

{
    "color_scheme": "Packages/User/SublimeLinter/Наша схема",
}

Далее нужно установить самый главный плагин в «Sublime — Package Control». Вот инструкция для его установки. Он делает установку и удаление плагинов очень удобным. Так же на этом сайте можно найти много справочной информации и кучу плагинов. Нам же нужно находясь в редакторе нажать сочетание клавиш ctrl+shift+p, что вызовет контекстное меню, в поле ввода которого нужно набрать «pac» и получить примерно такой результат.

 

В этом списке нас интересует пункт «Package Control: Install Package». Выбираем его и перед нами откроется список плагинов доступных для установки.

 

Emmet

Официальная документация

Наверное один из самых популярных плагинов для текстовых редакторов кода. Он позволяет по нажатию клавиши «TAB» (можно изменить в настройках) превращать простые сокращения в блоки html и css кода. Что очень способствует увеличению продуктивности веб-разработчика.

 

BracketHighlighter

Официальная страница.

Незаменимый плагин при работе с кодом, если конечно Вас не устраивает стандартная подсветка. Он повышает удобство работы с кодом, что наглятно продемонстрировано на картинке ниже.

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

и если это Вам доставляет некоторое неудобство (как например мне), то Вы можете поправить ситуацию лишь изменив одну настройку. Отправляемся в «Preferences -> Package Settings -> BracketHighlighter -> Bracket Settings User» и прописываем там следующее (число можете ставить по вкусу) и проблема будет решена :

{
	"search_threshold": 50000,
}

 

AutoFileName

Официальная страница.

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

 

AllAutocomplete

Официальная страница.

Стандартное автодополнение в редакторе работает только с текущим файлом. Данный плагин осуществляет поск по всем файлам открытым в редакторе в данный момент. Это так же значительно ускоряет написания кода.

 

ASCII-Decorator

Официальная страница.

Данный плагин по сочетанию клавиш ctrl+shift+k превращает выделенный текст из обычного в декоративный. Шрифт можно настроить с помощью файла настроек. Доступ к которому можно получить из меню «Preferences -> Package Settings -> ASCII-Decorator -> Settings — User». Вот содержимое моего файла настроек:

{
	"favorite_fonts": [
        {
            "name": "Default Font",   // (required) Friendly name for font configuration
            "font": "banner3",          // (required) Font
            "comment": true,          // Override default setting
            "comment_style": "block", // Override default comment style
            "width": 80,              // Override default width
            "direction": "auto",      // Override default direction
            "justify": "auto",        // Override default justification
            "indent": true,           // Override default additional indentation setting
            "flip": false,            // Flip output
            "reverse": false          // Reverse output
        }
    ]
}

Им я пользуюсь по большей части для быстрому поиску по файлу с помощью minimap.

 

JavaScript Next

Официальный сайт.

Плагин обеспечивает улучшенную подсветку синтаксиса, так же поддерживает стандарт EcmaScript 2015. Для того чтобы изменить подсветку синтаксиса, необходимо открыть файл с расширением .js и выбрать новый синтаксис: «View -> Syntax -> Open all with current extension as… -> JavascriptNext». Также в «Preferences -> Settings — User» и дописать в настройки :

"ignored_packages":
	[
		"JavaScript",
	],

 

CSS3

Официальный сайт.

Так же как и предыдущий плагин он улучшает подсветку, только уже стилей. И опять же нужно в настройках выбрать CSS3 в качестве подсветки по умолчанию, а стандартную подсветку отключить.

"ignored_packages":
	[
		"CSS",
		"JavaScript"
	],

 

Less

Официальный сайт плагина.

Официальный сайт less.

Руководство для начинающих.

Less это препроцессор для CSS. Он один из самых простых его представителей и тем самым является по большей части стартовой технологией для многих начинающих веб мастеров. Если Вам не хватает в CSS вложенности стилей, переменных, условий, циклов, функций и миксинов, то Вы просто обязаны попробовать Less. На официальном сайте Вы найдете подробную документацию по использованию, а на ютубе кучу роликов по использованию. Так же есть очень удобное руководство (на русском языке кстати).

Принцип работы Less в одной картинке:

 

Stylus

Официальный сайт плагина.

Официальный сайт stylus.

Очень продвинутый препроцессор для CSS. На ряду с LESS и Sass(SCSS). От конкурентов отличается довольно удобным и интуитивно понятным сайтом, а так же нестогим синтаксисом (можно как писать в стандартной нотации CSS, так и в нотации Sass, тоесть без лишних символов, что является предпочтительным стилем)  + его полной поддержкой Emmet (за исключением некоторых неудобных моментов, но не смертельно).

 

Несколько полезных ссылок

Официальный сайт.

Бесплатный видео курс по редактору.

Горячие клавиши для WINDOWS

Первоначальная настройка Sublime Text / Тяпк

// Текст адресован студентам моих курсов.

1. Установка пакетного менеджера (Package Control)

В текущей версии Sublime Text 3 делается предельно просто. Выбираем пункт меню Tools -> Install Package Control Install Package Control 1

Дожидаемся сообщения об успешной установке Install Package Control 2

2. Установка пакета Emmet

Нажимаем клавиатурное сочетание Ctrl+Shift+P (также можно выбрать пункт меню Tools -> Command Palette), чтобы отобразился список команд. Install Sublime Package 1st step

Набираем команду Install Package Install Sublime Package 2nd step

Набираем название пакета Emmet Install Sublime Emmet Package 1st step

Дожидаемся успешной установки Install Sublime Emmet Package 2nd step

3. Несколько полезных пакетов Sublime Text 3

  • AutoFileName — автокомплит для названий файлов внутри проекта.
  • AdvancedNewFile — создание нового файла через Ctrl+Alt+N
  • BracketHighlighter — подсветка парного тега в HTML
  • Color Highlighter — превью цвета в файлах, например видеть #bce8f1.
  • Material Theme — красивая тема в стиле материального дизайна. Активируется командой «Material Theme: Activate Theme»
  • SideBarEnhancements — дополнительные команды контекстного меню для проводника

Установка всех пакетов аналогична установки пакета Emmet.

Файл настроек Sublime Text

Все индивидуальные настройки доступны в пункте меню Preferences -> Settings.

Описание настроек Sublime на русском

Мои настройки такие:

{
    "always_show_minimap_viewport": true,
    "bold_folder_labels": true,
    "color_scheme": "Packages/Material Theme/schemes/Material-Theme-Palenight.tmTheme",
    "fallback_encoding": "Cyrillic (Windows 1251)",
    "font_face": "Consolas",
    "font_options":
    [
        "gray_antialias",
        "subpixel_antialias"
    ],
    "font_size": 13,
    "ignored_packages":
    [
        "Vintage"
    ],
    "indent_guide_options":
    [
        "draw_normal",
        "draw_active"
    ],
    "line_padding_bottom": 3,
    "line_padding_top": 3,
    "material_theme_contrast_mode": true,
    "material_theme_panel_separator": true,
    "material_theme_tree_headings": true,
    "original_color_scheme": "Packages/Color Scheme - Default/Monokai.tmTheme",
    "overlay_scroll_bars": "enabled",
    "show_encoding": true,
    "show_line_endings": true,
    "theme": "Material-Theme-Palenight.sublime-theme"
}

Настройки | Sublime Text

Практически все параметры Sublime Text настраиваются вручную через файлы конфигурации. Это не самый удобный способ на свете, но зато очень гибкий. При желании, например, можно задать настройки для конкретного типа файлов или для отдельного проекта.

Для того, чтобы увидеть все доступные параметры, выберите пункт меню . В окне редактора откроется файл, который физически располагается тут: Packages/Default/Preferences.sublime-settings. Редактировать значения в нем крайне нежелательно, так как при следующем обновлении они скорее всего будут перезаписаны.

Основные настройки

Если вы хотите изменить какой-либо из параметров, откройте пользовательский файл настроек и скопируйте в него необходимый параметр. Например:

{
    «tab_size»: 4,
    «translate_tabs_to_spaces»: false
}

Отдельные настройки для каждого языка

Кроме этого, можно задать специфичные настройки для каждого языка. Откройте какой-нибудь файл для редактирования, а затем выберите пункт меню . Редактор сам создаст нужный файл настроек. Таким образом, например, можно задать цветовую схему для каждого типа файлов.

Настройки для проектов

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

Настройка отвлеченного режима

Настройки отвлеченного режима из меню .

Параметры и горячие клавиши

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

[
  {
    «keys»: [«alt+w»],
    «command»: «toggle_setting»,
    «args»:
    {
      «setting»: «word_wrap»
    }
  }
]

Теперь, в текущем файле, при кажом нажатии altw будет включаться или отключаться перенос слов.

Если необходимо задать параметр со значением, используйте команду set_setting. Вставьте, например, следующий код:

[
  {
    «keys»: [«ctrl+k», «ctrl+c»],
    «command»: «set_setting»,
    «args»:
    {
      «setting»: «color_scheme»,
      «value»: «Packages/Color Scheme — Default/Cobalt.tmTheme»
    }
  }
]

Теперь, при последовательном нажатии двух сочетаний клавиш ctrlk, ctrlc в текущем файле подсветка синтаксиса переключится на тему Cobalt.

Приоритет файлов настроек

При конфигурации редактора следует иметь ввиду порядок, в котором файлы настроек переопределяют друг друга:

  1. Packages/Default/Preferences.sublime-settings
  2. Packages/Default/Preferences (<platform>).sublime-settings
  3. Packages/User/Preferences.sublime-settings
  4. <Project Settings>
  5. Packages/<syntax>/<syntax>.sublime-settings
  6. Packages/User/<syntax>.sublime-settings
  7. <Buffer Specific Settings>

Решение проблем

Так как одни и те же настройки могут быть заданы в различных местах, бывает полезно определить, какое значение имеет тот или иной параметр в текущем файле. Например, для параметра font_face, откройте консоль и наберите:

view.settings().get(‘font_face’)

Настройка редактора SublimeText 3 для верстки

Привет дорогие друзья. Ни для кого не секрет, что хороший инструмент для верстки сайтов — значительно повышает как ее качество, так и скорость работы. А инструмент, про который пойдет речь сегодня — замечательный редактор кода SublimeText 3

Более года назад я случайно наткнулся на его. И знаете что: после первого же запуска этой программы я понял — вот это именно то, что мне нужно! С тех самых пор я ни разу ему «не изменил ему». И верстаю сайты только на редакторе SublimeText. Он понравился мне в первую очередь своим минимализмом и удобством. В делать в нем сайты — сплошное удовольствие! Поверьте мне

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

Согласитесь, разобраться во всем этом «буреломе» самому, не имея под носом пошагового руководства — довольно трудоемкая задача. Да здесь «черт ногу сломит» от такого разнообразия плюшек и дополнений! Поэтому, я решил записать пошаговый видеокурс, который так и называется:

Настройка редактора SublimeText 3

Верстай с душой!

Обращаю внимание, что курс нацелен в первую очередь на настройку редактора для максимально удобной верстки сайтов. И рассчитан на новичков, так как начинаем мы в нем с «детского сайда», а именно — установки программы. И процессе — настроим ее и подключим много интересных плагинов, которые будут полезны именно верстальщикам.

В общем, весь свой опыт я выложил в уроках и залил их на YouTube в один плейлист:

Смотреть уроки

Показать список уроков

Показать материалы к курсу

Рекомендую пройти этот видеокурс своим ученикам. Так как очень скоро стартанет один интересный тренинг, и работать мы в нем будем именно на SublimeText 3!

PS: Если вы знаете интересные плагины, пишите в комментариях — запишу новые уроки с их разбором.

Sublime Text 3 — пользовательская подсветка синтаксиса / Habr

Расширяемость Sublime Text не знает границ. Для тех, кому мало стандартных функций, на Хабре уже рассказывали о том, как создать сниппет, как написать простой плагин, как написать сложный плагин и еще много много чего. Про ручную настройку подсветки синтаксиса толком ничего не смог найти: для кого-то слишком очевидно, кому-то просто не нужна, а кому-то и наверняка же пригодится.

Итак, задача: имея какие-нибудь абстрактные логи доступа в wonder-net:

!->14/02 16:44:22 [134.249.51.251:39951>80] (t1 19) >HTTP  in:504 out:34  Time:156
GET /516874233**21893/ HTTP/1.1 SCOD=00
!->14/02 16:44:24 [134.249.51.251:49507>80] (t1 20) 
GET /44058858**409377/ HTTP/1.1 SCOD=00
!->14/02 16:54:11 [195.18.13.107:1721>80] (t2 22) 
GET /41494377**562173/ HTTP/1.1 SCOD=00
!->14/02 16:54:11 [195.18.13.107:1721>80] (t2 23) >HTTP  in:385 out:10138  Time:156
GET /5211537**1172048/ HTTP/1.1 SCOD=00
!->14/02 16:54:24 [195.18.13.107:1727>80] (t1 30) >HTTP  in:423 out:1220  Time:187
GET /5211537**6447554/ HTTP/1.1 SCOD=23
!->14/02 18:07:24 [82.145.208.159:43634>80] (t2 52) 
GET /4149437**8265377/ HTTP/1.1 SCOD=00
!->14/02 18:09:41 [82.145.208.174:41708>80] (t2 61) 
GET /4149497**5750155 / HTTP/1.1 SCOD=00
!->14/02 18:51:39 [82.145.210.33:55210>80] (t1 66) >HTTP  in:543 out:34  Time:0
GET /5168757**9478487/ HTTP/1.1 SCOD=00
!->14/02 18:51:40 [82.145.210.33:55332>80] (t1 68) >HTTP  in:544 out:1243  Time:141
GET /4149497**0456701 / HTTP/1.1 SCOD=00
!->14/02 18:51:46 [82.145.210.33:57345>80] (t1 73) >HTTP  in:544 out:1243  Time:125
GET /5168742**0521893/ HTTP/1.1 SCOD=00

выделить:
Дату-время — фиолетовым курсивом;
Номер карты — желтым курсивом, если не в черном списке или красным, если иначе;
ip-адрес — темно-зеленым, если не в черном списке или красным, если иначе;
scod=хх — темно-зеленым если 00 или красным, если иначе.

В нашу цветовую схему нужно добавить стили, которыми мы собираемся подсвечивать текст. Насколько я понял, все цветовые схемы аккуратно собраны в файле c:\Program Files\Sublime Text 3\Packages\Color Scheme — Default.sublime-package.

Файл представляет собой zip архив без сжатия. Распаковываем, выбираем любимую схему (по умолчанию Monokai.tmTheme) и копируем ее в…(запускаем Sublime Text: меню Preferences — Browse Packages) папку User.

Открываем свежескопированный Monokai.tmTheme для редактирования. В самом низу перед закрывающимся добавляем блоки стилей. Стиль может содержать три параметра: background, foreground и fontStyle. fontStyle в свою очередь bold, italic и underline.

фиолетовый курсив будет выглядеть так:

<dict>
	<key>scope</key>
	<string>violet</string> <!-- По этому имени будем обращаться к стилю --> 
	<key>settings</key>
	<dict>
		<key>foreground</key>
		<string>#EE82EE</string>
		<key>fontStyle</key>
		<string>italic</string>
	</dict>
</dict>

жирный желтый(ЖЖ):
<dict>
	<key>scope</key>
	<string>yellow</string>
	<key>settings</key>
	<dict>
		<key>foreground</key>
		<string>#FFD700</string>
		<key>fontStyle</key>
		<string>bold</string>
	</dict>
</dict>

темно-зеленый:

<dict>
	<key>scope</key>
	<string>green</string>
	<key>settings</key>
	<dict>
		<key>foreground</key>
		<string>#006400</string>
	</dict>
</dict>

красный:

<dict>
	<key>scope</key>
	<string>red</string>
	<key>settings</key>
	<dict>
		<key>foreground</key>
		<string>#FF0000</string>
	</dict>
</dict>

2. В той же папке User создаем файл синтаксиса: wonderLog.tmLanguage с содержимым:
<?xml version="1.0" encoding="UTF-8" ?>
<plist version="1.0">
    <dict>
        <key>patterns</key>
        <array>
            <dict>
                <key>name</key>
                <string>red</string> <!-- Имя стиля --> 
                <key>match</key>
                <string>\b(?i)(?:5168742**0521893|414943**01562173|4149497**5750155)\b</string> <!-- Регулярное выражение к-рое надо выделить (номера из черного списка) --> 
            </dict>

            <dict>
                <key>name</key>
                <string>red</string> 
                <key>match</key>
                <string>\b(?i)(?:134\.249\.51\.251|82\.145\.208\.174)\b</string> <!-- ip из черного списка (точки экранируем) --> 
            </dict>

            <dict>
                <key>name</key>
                <string>green</string> 
                <key>match</key>
                <string>\b(?i)scod=00\b</string> <!-- scod=00 --> 
            </dict>

            <dict>
                <key>name</key>
                <string>red</string> 
                <key>match</key>
                <string>\b(?i)scod=\d+\b</string> <!-- scod!=00 --> 
            </dict>

            <dict>
                <key>name</key>
                <string>green</string> 
                <key>match</key>
                <string>\b\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}\b</string> <!-- остальные ip (конечно, надо не так, но...) --> 
            </dict>

            <dict>
                <key>name</key>
                <string>yellow</string> 
                <key>match</key>
                <string>\b\d{16}\b</string> <!-- остальные номера --> 
            </dict>

            <dict>
                <key>name</key>
                <string>violet</string> 
                <key>match</key>
                <string>\d{1,2}/\d{1,2}\s\d{2}:\d{2}:\d{2}</string> <!-- дата, время --> 
            </dict>

        </array>
        <key>name</key>
        <string>wonderLog</string> 
        <key>scopeName</key>
        <string>wonderLog</string>
        <key>fileTypes</key>
        <array>
            <string>log</string> <!-- К этому расширению файла будет автоматически применяться данный синтаксис -->
        </array>
    </dict>
</plist>

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

Сохраняем все.

Выбираем пользовательскую цветовую схему: Preferences — Color Scheme — User — Monokai.

Открываем наш чудо-лог (если расширение файла не совпадает с шаблонным, делаем View — Syntax — wonderLog) и наслаждаемся результатом:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *