Настройка Sublime Text 3

1) Скачиваем Sublime Text 3

sudo apt update
sudo apt install apt-transport-https ca-certificates curl software-properties-common

curl -fsSL https://download.sublimetext.com/sublimehq-pub.gpg | sudo apt-key add -

sudo add-apt-repository "deb https://download.sublimetext.com/ apt/stable/"

sudo apt update
sudo apt install sublime-text

Starting Sublime Text

You can start the Sublime Text editor either from the terminal by typing subl or by clicking on the Sublime icon (Activities -> Sublime)

2) Настройка рабочей среды

View -> Sidebar-> Show open files

Устанавливаем цвтовую схему:

tools-> command palette -> install package control

tools-> command palette -> package install package control

tools-> command palette -> base16 color schemes

preferences - color scheme-> ocean

preferences->theme->adaptive

Далее астройки правим:

Preferences->settings

http://fls.guru/sublime.html

"draw_white_space": "all", //Отображает непечатаемые символы
"draw_indent_guides": false, //Убирает направляющие линии
"font_size": 10, //Размер шрифта по умолчанию
"margin": 0,//Убирает отступы
"tab_size": 3, //Размер табуляции
"trim_trailling_white_space_on_save": false, //Отключает самодеятельность программы
"remeber_open_files": true, //Помнит открытые ранее файлы

Разбивка экрана по вертикали:

view-> layout

Устанавливаем цветовую схему для scss

CTRL+SHIFT+P -> install SCSS

Автоматический путь к файлу. Устанавливаем плагин:

https://stackoverflow.com/questions/31840550/cant-find-certain-package-in-package-control-install-package#:~:text=would%20have%20originally%3A-,Go%20to%20Preferences%20%3E%20Package%20Control,to%20install%2C%20then%20restart%20sublime.

CTRL+SHIFT+P ->Add rep->https://github.com/liamcain/AutoFileName

CTRL+SHIFT+P ->Install packages

CTRL+SHIFT+P -> autofilename

Устанавливаем bracket highlighter:

CTRL+SHIFT+P ->Package Control: Install Package-> BracketHighlighter

Устанавливаем color highlighter:

CTRL+SHIFT+P ->Package Control: Install Package->ColorHighlighter

Устанавливаем Emmet: Emmet.io

CTRL+SHIFT+P ->Package Control: Install Package->Emmet

Настройка сниппетов Emmet

Preferences -> Package Settings -> Emmet -> Settings - User

Устанавливаем Goto-CSS-Declaration (навигация в коде):

Горячие клавиши: Preferences -> Key bindings

[
{
"keys": ["ctrl+1"], "command": "goto_css_declaration", "args": {"goto":"next"} // Переход на style.css по нажатию ctrl+1 с index.html
},{
"keys": ["ctrl+`"], "command": "tag_classes"// Копирует в имена классов из HTML
}
]

Установим Tag (Коприование классов)

GitHub - titoBouzout/Tag: Collection of packages about HTML/XML tags.GitHub

ctrl+`

https://packagecontrol.io/packages/eCSStractor