Введите текст для поиска

среда, 29 марта 2017 г.

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

У кого канал толстый - видео 
Кто любит читать текст:

  1. Заходим в Сублайм текст 3. 
  2. Нажимаем Ctrl+Shift+P. 
  3. В вышедшем окошке набираем "Install" и выбираем в списке ниже "Package Control: Install Package"
  4.  После установки опять повторяем пункт 3, в появившемся окошке набираем "Emmet", выбираем в списке ниже и устанавливаем. Emmet - это плагин для быстрого набора html и css кода. Этот плагин позволяет пользоваться сокращениями, которые позже развертываются в полноценный код. Инструкцию по пользованию легко сможете найти в интернете. 
  5.  Далее, если вам понятен принцип установки плагинов, я не буду писать, что нужно повторять пункт 3 и в появившемся окне набирать названия плагинов. 
  6. AutoFileName - плагин позволяет быстро прописывать пути до файлов. Когда вы начинаете набирать путь до файла, в всплывающем окне появляются названия папок и файлов, которые можно найти по этому адресу. Например, есть папка img, в которой находится папки header, content, footer. В свою очередь в папке  header находятся изображения  logo.jpg, background.jpg. При наборе адреса /img во всплывающем окне будут появляться папки header, content, footer. Далее при наборе /img/header - будут появляться названия файлов  logo.jpg, background.jpg
  7. Gist - плагин позволяет хранить куски кода на github и получать к ним доступ, не выходя из sublime text. 
  8. Sass - плагин позволяет ускорить разработку css кода. Сам не пробовал, поэтому пока прокомментировать ничего не могу. 
  9. One Dark Material Theme и One Dark Color Scheme - оформление тема. 
  10. Buffers Scroll - ссылка . Этот плагин нельзя установить напрямую из Sublime text. По ссылке нажимаем зеленую кнопку справа "Clone or Download", ниже выбираем вариант "Download ZIP". Скачиваем архив и распаковываем. Затем в Sublime text в верхнем меню выбираем пункты "Preferences"  -> "Browse Packages". Откроется окно проводника. В папку, которая открылась (Sublime text/Packages) перемещаем распакованную папку Buffers Scroll. Собственно больше ничего делать не нужно. 
  11. Плагины установлены, теперь займемся настройкой. 
  12. По ссылке скопируем в тексте слева пункт "Settings". Копировать нужно сам текст настроек, включая открывающую и закрывающую скобки. Затем в Sublime text в верхнем меню выбираем "Preferences" - > "Settings". Откроется новое окно, в правой части окна выбираем все нажатием клавиш Ctrl + A. Затем вставляем скопированный текст настроек нажатием клавиш Ctrl + V. Затем сохраняем настройки нажатием клавиш Ctrl + S. Все оформление Sublime text после сохранения настроек должно измениться. Для чего предназначена каждая настройка - можно прочитать, найдя соответствующие значения в левом окне. 
  13. Осталась еще одна настройка. По ссылке в пункте 12 копируем текст из пункта keymap: windows users. Далее в Sublime text необходимо выбрать пункты меню "Preferences" -> "Key Bindings" и вставить скопированный текст в окошко справа. Не забудьте удалить квадратные скобки, если они задвоились. Должна быть одна открывающая [ и одна закрывающая ] скобки. Затем нажимаем Ctrl + S, чтобы сохранить настройки. Эта настройка позволяет выравнивать строки кода. Для этого выбираем выравниваемые строки и нажимаем сочетание клавиш Alt + Shift + F.    
  14. Для быстрой настройки Sublime text необходимо в верхнем меню выбрать пункты "Preferences" - > "Browse Packages", и скопировать содержимое открывшейся папки Sublime text/Packages. Впоследствии, вам останется всего лишь заменить содержимое аналогичной папки на свежеустановленной версии Sublime text на вашу резервную копию. 
На этом все, всем удачи и поменьше IE 6)). 


Если вам понравилась/принесла пользу эта запись, то сказать "СПАСИБО" очень просто - поделитесь записью в социальных сетях при помощи кнопочек ниже. Вам несложно, а мне приятно!

Комментариев нет :

Отправить комментарий