No build system sublime text что делать

Обновлено: 04.07.2024

В процессе разработки ПО весьма не мало зависит от используемого редактора кода. Я, поддавшись веянью моды, решил освоить текстовый редактор Sublime Text 2, слишком уж много положительных отзывов я слышу о нем. Мне самому хватало Eclipse. Но со временем в Eclipse меня стало раздражать подтормаживание интерфейса и в конечном итоге я пришел к выводу, что всех «прибамбасов» Eclipse мне не надо, а от Eclipse мне нужна лишь подстветка синтаксиса, навигация по проекту, быстрые клавиши и работа с Ant. Ant обычно в проектах у меня делал компиляцию или упаковку проекта (тут под упаковкой подразумевается распределение исходников по определенной в структуре каталогов, как это в PHP-фреймворках или в RubyOnRails нужно) и отправку итога на веб сервер по FTP. Начиная работу с Sublime Text 2, мне не хотелось переключаться на консоль для вызова Ant, а использовать его непосредственно в интерфейсе Sublime Text 2. И решение было найдено.

1.Подготовка

Итак, что у нас есть:

  • рабочая машина у нас с Windows
  • установлен JDK и на его директорию «bin» есть ссылка в переменной среды PATH
  • установлен Ant и на его директорию «bin» есть ссылка в переменной среды PATH
  • установлен редактор Sublime Text 2 (хотя тут я приведу все для portable версии)

Перво-наперво открываем в Sublime Text 2 нашу папку с исходниками «File»->«Open Folder. » и сохраняем манифест проекта «Project»->«Save Project As. », допустим это «helloworld.sublime-project», в корень.

2.Проверка работоспособности вызова Ant в Sublime Text 2

Для примера создадим в корневой директории проекта файл «build.xml» следующего содержания:

и попробуем Ant:

  1. «Tools»->«Build System»->«Ant»
  2. «Tools»->«Build» или «Ctrl+B» или «F7»

и должно появиться внизу у Sublime Text 2:

Было обнаружено, что может возникнуть ситуация, когда Ant даже не вызовется. Симптом был такой: при запуске «Tools»->«Build» внизу в статусбаре говорилось «Building» и ничего не происходило. Открываем Sublime консоль через «Ctrl+`» и видим ошибки:

Нужно заменить в «exec.py» (*SublimeText2DataPackagesDefault для portable версии) строку:

и теперь все должно работать.

3.Создаем свой Build в Sublime Text 2

В пункте 2 продемонстрировано, что Sublime Text 2 изначально позволяет использовать из «build.xml» только «default» цель или связанный с ней каскад целей (выше это просто «test»). А мне, как я сказал ранее, нужно вызывать еще и отличные от «default» конечные цели «trial» и «build». Поскольку мы удостоверились, что Ant работает, то просто заменим «default» цель с «test» на «build» и пользуемся горячими клавишами «Ctrl+B» или «F7».

А для цели «trial» я создал свой «Build System», используя «Tools»->«Build System»->«New Build System. », и сохранил файл в директории *SublimeText2DataPackagesUser (для версии portable), хотя директорию Sublime Text 2 сам предложит нужную

тут еще можно задать много интересных параметров.
Автоматически в меню должен появиться пункт «Tools»->«Build System»->«Ant TRIAL», выбираем его и пользуемся «Ctrl+B» или «F7» для сборки триальной версии. Если нужно итоговую сборку сделать, то переключаемся на «Tools»->«Build System»->«Ant» и пользуемся «Ctrl+B» или «F7». Но нам же и этого мало.

4.Настройка сочетаний клавиш в Sublime Text 2

Зачем постоянно переключаться между «Ant TRIAL» и «Ant», хотя у меня не часто это происходит. Назначим быстрые клавиши «Preferences»->«Key Bindings — User»:

это подсмотрел в «Preferences»->«Key Bindings — Default»:

Вернемся к «Tools»->«Build System»->«Ant», жмем «F8» и получаем «trial»:

/.config/sublime-text-2/Packages/. Рассованы по папкам, легко было достать, изменить, удалить. В Sublime-Text-3 Их нет нигде, find не помогает, пяток билдеров из коробки не могу найти в системе, те что самодельные сохраняются в

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


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


А на оффицальном форуме спрашивал?


В 3 используется питон3, поэтому всё что написано на питон2 отвалилось нафиг. Апи 3 нестабильно, поэтому написаторы плагинов переписывать их на 3 особо не спешат, да и питон3 не особо хотят/знают. Например, sublime-ensime может зарегать меню, но все пункты его серые и не работают. Привет некрофилам, которые продолжают писать под питон2.

Стандартные пакеты лежат в каталоге с приложением. У меня это /home/olegchir/opt/sublime_text_3/Packages/

Где лежат юзерские пакеты можно посмотреть, щелкнув Preferences->Browse Packages. У меня это

1) Открыть (или создать) в текстовом редакторе

2) Добавить туда в конец списка Added Associations нечто вроде: [Added Associations] inode/directory=kde4-dolphin.desktop

3) PROFIT, теперь будет открываться через Dolphin или что ты там указал, лишь бы не konqueror

stevejobs ★★★★☆ ( 13.08.13 01:50:20 )
Последнее исправление: stevejobs 13.08.13 01:53:56 (всего исправлений: 1)


Когда я создаю свои билдеры, они появляются в этом же списке (Tools -> Build System), но хранятся в

/.config/sublime-text-3/Packages/ (где-то там), а вот стандартные (из коробки) я не могу найти, чтоб отредактировать.отдельных файлов, вида name.sublime-build найти не получается, эти "стандартные" билдеры куда то вшиты? в каком то конфиге? в каком то плагине, пакете? куда они делись вообще?


Стандартные пакеты лежат в каталоге с приложением. У меня это /home/olegchir/opt/sublime_text_3/Packages/

как их изменить? Идешь и изменяешь) Но рекомендованный способ таки - копипаст в user packages и потом правка там

а если используешь пакеты твоего дистрибутива, то набери уже locate Erlang.sublime-package и посмотри путь куда установлено. Но блин, нафиг для этого юзать пакеты, скачай нормальный дистр с официального сайта и положи его в /opt (или

stevejobs ★★★★☆ ( 13.08.13 11:43:28 )
Последнее исправление: stevejobs 13.08.13 11:45:35 (всего исправлений: 1)


То есть билдеры вшиты в пакеты аля Java.sublime-package? Спасибо за ответы.


Да, это очень удобно, скопировал пакет с именем языка - и у тебя Всё Работает. Это не по всему интернету куски конфига емакса собирать ))


Стоит все, просто не получалось найти эти родные билдеры)) всю систему перерыл.

Данная статья рассказывает о том, по шагам, как настроить связку Sublime text 3, AC6 System Workbench for STM32 и STM32CubeMX в качестве среды разработки для STM32 под MS Windows x64.

Аналогичная инструкция по настройке среды в Linux лежит тут.

Что в итоге у меня получилось:

  • Sublime Text 3 с автодополнениями и подсветкой всех функций, включая HAL и остальные библиотеки проекта;
  • AC6 System Workbench for STM32 с кастомизированными перспективами и прочими плюшками;
  • Конечно же использую контроль версий в Git.

Предварительно устанавливаем необходимый софт

Создадим директорию для хранения библиотек и проектов

Я предпочитаю хранить библиотеки на всех своих машинах по одному и тому же пути. Т.к. для компиляторов в общем случае нужны абсолютные пути (тот же CubeMX генерирует абсолютные пути к библиотекам), я создаю отдельную директорию в корне второго раздела диска. У меня это везде D:\Libs.

Аналогично и для проектов я тоже предпочитаю создавать директорию на отдельном, несистемном разделе. В моём случае это D:\workspace.

Устанавливаем Oracle JRE

Скачиваем дистрибутив с сайта Oracle. Ставим со всеми настройками по-умолчанию.

Устанавливаем STM32CubeMX

Скачиваем дистрибутив с сайта ST (потребуется регистрация), разархивируем и запустим установщик. Пока ставим со всеми настройками по-умолчанию.

Запускаем STM32CubeMX, идём в настройки Help->Updater Settings и меняем путь для хранения библиотек на D:\Libs\STM32Cube\Repository.

Скрин

Установим библиотеку для STM32F3. Открываем Help->Install New Libriaries, ставим галку Firmware Package for Family STM32F3, жмём Install Now

Скрин

Устанавливаем Sublime Text 3

Вообще, SW4 вполне самодостаточная IDE. Но я люблю кодить именно в ST3, а компиляция и дебаг в SW4. Инструкция по установке ST3 для любых дистрибутивов лежит тут.

Скачиваем, устанавливаем, никаких чудес

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

Скрин

При установке Clang надо выбрать галку Add LLVM to the System PATH:

В процессе установки выдаст ошибку при попытке интегрировать в MS VisualStudio. Просто закройте окно.

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

Для начала установим Package Control. Запускаем ST3 и жмём CTRL+`, в командную строку вставляем код и жмём ENTER:


Для полноценной работы нам понадобятся такие пакеты:

  • ARM Assembly (Подсветка Assembler в коде)
  • C Improved (Подсветка C)
  • CMakeEditor (Подсветка Cmake)
  • DocBlokr (Форматирование комментариев)
  • EasyClangComplete (автодополнение функций)
  • Hex to Int preview (показывает значение HEX)
  • SublimeAStyleFormatter (форматирует код нажатием CTRL+SHIFT+A)
  • Sublimelinter
  • Sublimelinter-contrib-cmakelint (Подсветка cmake)
  • Sublimelinter-cppcheck (проверяет код на ошибки с помощью cppcheck)
  • Sublimelinter-annotations (Подсвечивает FIXME, NOTE, TODO и т.д.)

Устанавливаем нужные пакеты из меню Preferences -> Package Control -> Install Package.

Настраиваем пакеты ST3

EasyClangComplete

Настраиваем clang на C99 и указываем директории с базовыми библиотеками вроде StdLib.

Открываем Preferences -> EasyClangComplete -> Settings и вставляем в правую половину:

Sublimelinter

  • Линтер срабатывает только при загрузке/сохранении
  • Аннотации FIXME обводит как ошибку, остальные как предупреждение
  • CppCheck проверяет только правила Warning, Style, Performance и Portability, а также указываем стандарты C99 и C++11.
  • Не показывать ошибки отдельным окном при сохранении

Открываем Preferences -> Sublimelinter -> Settings и вставляем в правую половину:

SublimeAStyleFormatter

Форматирование настроено на мой вкус. Подробное описание всех пунктов есть в Preferences -> SublimeAStyleFormatter -> Settings - Default

Открываем Preferences -> SublimeAStyleFormatter -> Settings - User и вставляем:

Устанавливаем AC6 System Workbench for STM32 (SW4STM32)

Настройка SW4

Скрин

Запускаем SW4, создаём рабочую область по пути D:\workspace

При первом запуске будет установлен ARM Toolchain. После запуска кликаем на Workbench в правом верхнем углу.

Сначала установим удобную тему. Открываем Help->Install New Software, жмём Add.. и вводим:

Скрин

Жмём ОК, выбираем Eclipse Color Theme и жмём Next > и дальше всё по накатанной.

Включим тему: Window -> Preferences ->Appearance -> Color Theme. Я люблю Monokai, а вы можете позже подобрать, какую вам нравится.

Ну вот и пришло время запустить наш первый проект и проверить среду разработки в работе.

Повторюсь, я буду приводить примеры для отладочной платы STM32F3DISCOVERY. Делаю всё максимально просто, нам ведь просто надо проверить настройки среды разработки.

Запустим STM32CubeMX, выберем в главном окне New Project. Откроем вкладку Board Selector. Выбираем нашу плату:

  • Type of board: Discovery
  • MCU Series: STM32F3
  • Из списка ниже выбираем STM32F3DISCOVERY

Скрин

Сделаем минимальную настройку МК

В левом меню включим:

  • FreeRTOS: поставить галку Enabled
  • SYS: Trace Asynchronous Sw
  • Timebase Source: TIM17 (на текущем этапе можно выбрать любой)

Скрин

Переходим во вкладку Clock Configuration:

  • В поле HCLK вводим 64МГц (на встроенном осциляторе максимальная частота)

Настроим сам проект

Открываем Project->Settings из верхнего меню.

  • Указываем имя проекта в поле Project Name: STM32Discovery-SW4-Test
  • Указываем путь в поле Project Location: D:\workspace
  • Выбираем Toolchain: SW4STM32

Скрин

Откроем вкладку Code Generator и включим “Add necessary libriary files as reference in the toolchain project configuration file”

Скрин

Жмём ОК и теперь мы готовы создать проект. Жмите Generate Source Code в верхнем меню:

Проверим Sublime Text 3

  • Добавить проект в ST3: Project->Add folder to Project… и выбираем папку нашего нового проекта.
  • Создать новый файл: Правый щелчок на имени проекта слева -> New File

В открывшемся окне вставьте актуальные пути к библиотекам HAL:

Сохраним файл под именем .clang_complete (прям так, с точкой в начале имени).

Теперь надо сбросить кэш Cmake: CTRL-SHIFT-P -> EasyClangComplete: Clean current cmake cache

Откроем Src/main.c. Наведём курсор на какую-нибудь функцию и порадуемся всплывающим окошкам с её описанием. Подробнее о работе EasyClangComplete можно посмотреть тут.

Попробуем отформатировать код: нажмём CTRL+ALT+F и радуемся, как всё поменялось. Если предпочитаете другой стиль, нет проблем, настройки в Preferences -> SublimeAStyleFormatter.

Откомпилируем проект и посмотрим debug

Запускаем SW4 и импортируем проект:

  • File -> Import… -> General -> Existing projects into workspace
    • Select root directory: D:\workspace\STM32Discovery-SW4-Test
    • НЕ ставим галку Copy projects into workspace

    Скрин
    Скрин

    Выбираем проект в Project explorer. Компилируем Project -> Build Project. Если всё было сделано без ошибок ранее, проект скомпилируется за несколько секунд. И в консоли в нижней части будет примерно так:

    Кстати, под Linux тот же проект компилится за 6 секунд. Пишите, если знаете, почему.

    Подключим нашу плату к компьютеру и попробуем загрузить прошивку: Run -> Run as Ac6 STM32 C/C++ Application. Если всё удачно, в конце вывода консоли будет:

    Ну и самое вкусное. Запустим дебагер. Run -> Debug (или просто жмите F11). SW4 загрузит прошивку и предложит открыть отдельную перспективу для дебагера. Советую согласиться.

    Изначально наша программа будет остановлена на int main(void) <> , это брейкпонт по-умолчанию. Запустим программу нажав F8, чтобы инициализировались все настройки МК, потом остановим, нажав кнопку Suspend в верхней панели. Давайте попробуем зажечь светодиоды. В правой верхней части перспективы откроем вкладку I/O Registers, развернём GPIO и правый щелчок на GPIOE -> ODR -> Activate



    Теперь посмотрим в STM32CubeMX в нашем проекте, что светодиоды сидят на ногах PE8 - PE15:

    В столбце HEX Value в строках c GPIOE -> ODR -> ODR15 по GPIOE -> ODR -> ODR8 выставим 1 и радуемся магии, как загораются светодиоды на плате. Ставим 0 - гаснут.


    К сожалению, такая магия возможно только в остановленном состоянии, в отличие от того же Keil uVision, реалтайма тут нет. (грустный смайлик)

    Осталось только настроить Git.

    Установка Git

    Скрин

    Настройка Git

    Скрин

    В появившемся окне инициализируем Git, включая ввод персональных данных:

    Не забудьте подставить свои данные!

    Создадим .gitignore в корне проекта и добавим в него:

    Ну и сделаем коммит:

    В общем-то дальнейшие вещи выходят за рамки статьи о настройке среды разработки. Это и полноценное описание дебагинга, и всякие горячие клавиши ST3. Об этом я бы хотел поговорить в другой раз. Надеюсь, данная статья будет полезна, хотя ныне настройка среды стала гораздо проще, чем ещё год назад. Удачи!

    В следующем окне видим стандартный путь для установки программы. Нажимаем Next.

    Установка редактора кода SublimeText

    Далее инсталлятор предлагает включить запуск программы в контекстное меню, т.е. при нажатии на файл правой кнопкой мыши в контекстном меню мы будем видеть SublimeText для открытия файла. Это очень удобно. Поэтому устанавливаем флажок Add to explorer context menu и нажимаем кнопку Next.

    Установка редактора кода SublimeText

    В следующем окне нажимаем Install.

    Установка редактора кода SublimeText

    По окончании установки нажимаем Finish.

    После этого запускаем программу, щелкнув по ярлыку на рабочем столе.

    Запуск редактора кода SublimeText

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

    Отличие бесплатной версии от платной в том, что в шапке программы присутствует надпись UNREGISTERED

    Запуск редактора кода SublimeText

    И иногда появляется окно, предлагающее зарегистрировать и оплатить программу. Можно нажать Отмена и работать дальше.

    Запуск редактора кода SublimeText

    Настройка внешнего вида программы Sublime Text. Настройка цветовых схем

    Сначала отобразим боковую панель. Для этого надо выполнить команду Yiew – Side Bar – Show Side Bar

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

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

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

    Можно перетащить папку с файлами на левую панель.

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

    Настроим цветовую схему программы и кода. Для этого откроем файл с кодом html и перейдем по команде Preference – Color Scheme…

    Настройка цветовых схем редактора кода SublimeText

    Открывается окно с предустановленными цветовыми схемами

    Настройка цветовых схем редактора кода SublimeText

    При выборе любой из схем, изменяется цветовое оформление окна программы Sublime Text.

    Для того, чтобы подгружать в программу дополнительные цветовые схемы, необходимо сначала установить установщик.

    Для этого переходим в меню Tools – Command Palette…

    Установщик плагинов редактора кода SublimeText

    Появится окно с полем поиска.

    Установщик плагинов редактора кода SublimeText

    В поле поиска вводим install, пока не появится Install Package Control и нажимаем на него.

    Установщик плагинов редактора кода SublimeText

    Через некоторое время появится окно об успешной установке Package Control.

    Установщик плагинов редактора кода SublimeText

    Снова вызываем команду меню Tools – Command Palette…, в поле вводим install, пока не появится Package Control: Install Package и нажимаем на него.

    Установщик плагинов редактора кода SublimeText

    Через некоторое время появится окно со списком доступных дополнений.

    Настройка цветовых схем редактора кода SublimeText

    В поле поиска вводим название темы Base 16 Color Scheme.

    Настройка цветовой схемы Base 16 Color редактора кода SublimeText

    Нажимаем на этот пункт и ждем установки.

    После установки переходим к смене схем. Выполняем команду Preferences – Color Scheme.

    Настройка цветовой схемы Base 16 Color редактора кода SublimeText

    И видим, что в списке появилось гораздо больше цветовых схем.

    Настройка цветовой схемы Base 16 Color редактора кода SublimeText

    Наберем в строке поиска Ocean и выбираем эту тему.

    Настройка цветовой схемы Ocean редактора кода SublimeText

    Видим, что цветовое оформление изменилось.

    Настройка цветовой схемы Ocean редактора кода SublimeText

    Методом перебора Вы можете подобрать для себя другую понравившуюся цветовую схему.

    После этого выберем команду Preference – Theme…

    Настройка цветовой схемы редактора кода SublimeText

    И в появившемся окне щелкнем по Adaptive.sublime-theme.

    Настройка цветовой схемы редактора кода SublimeText

    После этого левая панель программы и окружение также стали темными.

    Настройка цветовой схемы редактора кода SublimeText

    Сделаем еще дополнительные настройки. Выполним команду Prefernce - Settings

    Настройка цветовой схемы редактора кода SublimeText

    Откроется новое окно, разделенное на две части. В левой части прописаны настройки по умолчанию. Их изменить нельзя, их можно только переопределить в правой части. Каждая следующая настройка должна отделяться запятой.

    Настройка цветовой схемы редактора кода SublimeText

    В правом окне уже прописаны некоторые настройки цветовой схемы.

    Внесите запись "margin": 0, //Убираем отступ

    И сохраните файл командой File – Save. Весь код немного подвинулся влево.

    Настройка цветовой схемы редактора кода SublimeText

    Чтобы увеличить или уменьшить размер шрифта в окне программы, достаточно зажать клавишу Ctrl и крутить колесико. Чтобы вернуться к настройкам по умолчанию, надо выполнить команду Preference – Font – Reset

    Настройка шрифтов редактора кода SublimeText

    Пропишем еще несколько настроек:

    “tab_size”: 3, //Размер табуляции – т.е. насколько сместится курсор влево при нажатии клавиши Tab

    "word_wrap": "true", //Перенос строк всегда

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

    Закройте это окно.

    Продолжим настраивать окно программы. Часто в ходе верстки необходимо отображать два файла: html и css. Для этого необходимо разделить окно программы на две части. Сделать это можно командой Yiew – Layout – Columns: 2

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

    Теперь мы можем расположить два файла с кодом рядом.

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

    Синтаксис имеет определенную подсветку для каждого языка. Чтобы увидеть весь список языков и синтаксисов, надо нажать в правом нижнем углу программы на пиктограмму языка. Например, для файла html в правом нижнем углу будет запись HTML, для файла css соответственно запись CSS. Надо щелкнуть по этой записи и появится весь доступный список.

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

    Но, чтобы синтаксис подсвечивался должны быть установлены соответствующие схемы.

    Установим дополнительные схемы подсветки синтаксиса.

    Например, для файлов SCSS в программе нет предустановленной подсветки синтаксиса. Если мы откроем файл SCSS, то увидим только белый цвет.

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

    Выбираем команду меню Tools – Command Palette…, далее вводим install и выбираем Package Control: Install Package.

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

    Вводим SCSS.

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

    После установки в левом нижнем углу окна программы появится запись об успешной установке, но запись быстро исчезнет. Можно проверить, что синтаксис SCSS появился в общем списке. Т.е. в правом нижнем углу вызываем список и видим SCSS в конце списка.

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

    Установка необходимых плагинов

    Auto File Name – необходим для того, чтобы Sublime Text автоматически прописывал пути к файлам, например, к картинкам.

    Выполняем знакомую нам команду Tools – Command Palette…, далее вводим install и выбираем Package Control: Install Package и затем AutoFileName.

    Настройка плагина AutoFileName редактора кода SublimeText

    После установки этого плагина в коде можно видеть содержимое папки, например, img и выбрать соответствующий файл.

    Настройка плагина AutoFileName редактора кода SublimeText

    Bracket Highlighter – плагин подсветки начальных и конечных элементов, например открывающего и закрывающего тегов, начальной и конечной кавычки, открывающей и закрывающей скобки и т.д.

    Настройка плагина BracketHighlighter редактора кода SublimeText

    Настройка плагина Color Highlighter редактора кода SublimeText

    Дополнительные настройки плагина можно сделать, выполнив команду Tools – Color Highlighter

    Настройка плагина Color Highlighter редактора кода SublimeText

    Emmet – позволяет с помощью сокращений писать команды кода.

    Например, чтобы написать такой код <div необходимо в редакторе набрать только имя класса и нажать клавишу Tab. Т.е. надо записать .main и нажать Tab

    После установки необходимо перезапустить программу.

    Goto Css Declaration – навигация в коде. Например, чтобы найти блок стилей для какого-либо класса в большом файле css, необходимо в html файле установить курсор на имя этого класса и нажать горячую клавишу. После этого в файле css курсор автоматически переместится в соответствующий блок стилей.

    Чтобы создать горячую клавишу, необходимо после установки плагина выполнить команду Preferences – Key Bindings.

    Настройка плагина Goto Css Declaration редактора кода SublimeText

    После этого появится экран из двух окон. В левом окне предустановленные настройки, которые нельзя изменить, но можно переопределить в правом окне.

    Например, сделаем следующую запись

    Настройка плагина Goto Css Declaration редактора кода SublimeText

    Тогда переход из html файла на нужный класс в таблице стилей css будет по нажатию клавиш ctrl+q. Не забываем, что в html-файле курсор должен стоять на имени класса, который ищем в таблице стилей.

    eCSStractor – плагин позволяет извлекать селекторы sass из html-кода.

    Выберите в меню программы Preferences – Package Settings – eCSStractor – Key Bindings – User. Наберите следующий код.

    Настройка плагина GeCSStractor редактора кода SublimeText

    Выберите в меню программы Preferences – Package Settings – eCSStractor – Settings – User. Наберите следующий код.

    Настройка плагина GeCSStractor редактора кода SublimeText

    Теперь можно извлекать селекторы, соответствующие методолигии БЭМ, прямо из HTML кода сочетанием клавиш Ctrl+`(ё).

    Tag – позволяет извлекать css селекторы из выделенного фрагмента html-кода.

    Устанавливает плагин вручную. Сначала скачайте сам плагин здесь. Затем распакуйте в папку по следующему адресу

    C;\Users\Твое имя пользователя\AppData\Rroaming\Sublime Text 3\ Packages

    Настройка плагина Tag редактора кода SublimeText

    После этого надо перезапустить Sublime Text.

    Теперь надо добавить горячую клавишу. Заходим Preferences – Key Bindings. Если была предыдущая запись, новую пишем через запятую. Введите следующий код.

    Настройка плагина Tag редактора кода SublimeText

    Весь наш файл с учетом предыдущих установок и настроек выглядит следующим образом. У Вас он может выглядеть по-другому. Главное обратите внимание на то, что записи разделяются запятыми (строки 5 и 9).

    Настройка плагина Tag редактора кода SublimeText

    Ссылки для редактора Sublime Text:

    Необходимые плагины:

    AutoFileName – необходим для того, чтобы Sublime Text автоматически прописывал пути к файлам, например, к картинкам.

    BracketHighlighter – плагин подсветки начальных и конечных элементов, например открывающего и закрывающего тегов, начальной и конечной кавычки, открывающей и закрывающей скобки и т.д.

    Goto-CSS-Declaration – навигация в коде. Чтобы найти блок стилей для какого-либо класса в большом файле css, необходимо в html файле установить курсор на имя этого класса и нажать горячую клавишу. После этого в файле css курсор автоматически переместится в соответствующий блок стилей.

    Tag – позволяет извлекать селекторы css из выделенного фрагмента html-кода.Tag.zip Путь для распаковки плагина - C:\Users\ Твое имя пользователя \AppData\Roaming\Sublime Text 3\Packages

    а также цветовую схему Base16 Color Scheme и подсветку синтаксиса SASS.

    Просмотреть все установленные плагины в Sublime Text можно командой Preferences – Package Settings

    Читайте также: