По поводу создания расширений VS Code имеет документацию, однако тут я попытаюсь более сжато показать процесс создания.
Я работаю на Mac поэтому команды будут соответствующие…
И так, что нам нужно?
- Собственно VS Code
- Node.js, а точнее его файловый менеджер — nmp
- VS code generator
Прямые руки
Процесс установки необходимых инструментов. Осторожно! Используется Terminal!
- Установка Node.js (можно пропустить если уже есть)
- Установка brew (можно пропустить если уже есть)
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
- Установка Node.js
brew install node
- Установка brew (можно пропустить если уже есть)
- Установка VS code generator
npm install -g yo generator-code
Создание Extension Template-а
- Работая все в той же консоли выполним команду
yo code
Пред вами предстанет следующая картина:
Необходимо выбрать JavaScript
- Затем механизм предложит вам заполнить еще несколько полей, после чего начнется процесс создания
Поздравляю. Template создан. Перейдем к коду.
Создание Extension-а
- Откроем созданную папку. Имя ее совпадает с extension identifier который вы указали ранее)
- Создаем папку snippets с вложенным json файл(ом/ами). Смысл в том чтобы для каждого языка vs editor можно было применять свой набор snippet-ов, чтобы это реализовать, необходимо регистрировать для каждого из требуемых вам языков свой файл snippet-ов. К примеру я использую sql и js, поэтому я сделаю себе 2 файла
- Регистрируем snippets в Extension-е. Зарегистрируем Snippet файлы и привяжем их к языкам к которым они будут применяться. Для этого в файле package.json добавим следующую простую конструкцию, в которой указано какому языку соответствует какой snippet
Код для ленивых"snippets": [ { "language": "csharp", "path": "./snippets/js_snippets.json" }, { "language": "sql", "path": "./snippets/sql_snippets.json" } ]
- Описание тела snippet-ов. Тело должно быть в формате json как уже было обозначено ранее. К примеру я для себя создал два шаблона (snippet-a). Один из них создает тело pl sql программы, а второй просто содержит в себе output snippet. Каждый snippet состоит из:
- json object snippet-a — определения его имени;
- prefix — команда благодаря которой сможем найти snippet;
- body — тело которое вставится в редактор;
- description — описание snippet-a.
И опять код{ "Default body": { "prefix": "defaultbody", "description" : "Declare dafault body", "body": [ "declare", "", " v_errorCode int;", " v_errorMessage nvarchar2(255);", "", "begin", "", " begin", "", " null;", " --Do something", "", " exception when others then", "", " v_errorCode = 101;", " v_errorMessage = substr(sqlerrm, 1, 200);", " ", " end;", "", " <<cleanup>>", " --dbms_output.put_line('Error code : '||v_errorCode);", " --dbms_output.put_line('Error message : '||v_errorMessage);", "end;" ] }, "Output": { "prefix": "output", "description" : "Dbms output", "body": [ "dbms_output.put_line('');" ] } }
- Запуск. Производится при помощи все того же vs code после чего открывается новый instance vs code
- Проверка. В новом instance нам необходимо выбрать язык написания кода sql и начать писать prefix одного из snippet-ов соответствующих выбранному языку и вот что у нас получится
-
Применение. Чтобы оставить extension на своем тарантасе и чтоб он всегда работал необходимо переместить папку с проектом в
user/.vscode/extensions/
Кажется, получилось неплохо? Экономьте время, народ… Time is $
Комментарии (15)
Peter03
12.06.2019 20:56+1Ставят минусы скорее всего из-за того что неудачно выбран пример (ну и за лёгкий налёт непонятно на чём базируемого высокомерия, типа вы все с дерева только что слезли, я вас сейчас палкой-копалкой научу пользоваться).
Сниппеты поддерживаются в VS Code без всякой магии. Ну или по крайней мере расскажите чем ваш пример лучше стандартного.
Если же ваша статья это пример создания расширения VS Code, то явно укажите что сниппеты это лишь пример и что в вашей статье нового по сравнению с предыдущими статьями подобного направления.
А лучше создайте реально полезный вариант, например включите анализатор кода выбранного проекта и автоматическое нахождение и создание сниппетов специфичное для него, думаю это было бы интересно.
The_Pavlikovich Автор
12.06.2019 21:13Высокомерия я тут не разглядел. Пытался писать максимально тактично и толерантно.
Мне кажется каждому разработчику хочется выпустить продукт, которым бы пользовались люди. Поэтому разработка собственного Extension-а даже пусть и такого простого будет хорошим началом в этом деле. Ведь те Сниппеты, о которых говорите вы, невозможно выложить в качестве Extension-а в глобальный доступ. Они будут доступны лишь вам.
Спасибо за конструктивную критику и советы. Есть над чем подумать…Peter03
12.06.2019 21:19Snippets — Я расскажу как сэкономить время
Чуток попахивает.
…
Кажется, получилось неплохо? Экономьте время, народ… Time is $
Ведь те Сниппеты, о которых говорите вы, невозможно выложить в качестве Extension-а в глобальный доступ.
Очень многое сделано до нас. Можно конечно сделать snippets «store» (или поиспользовать один из множества уже существующих), где вы можете автоматически обновлять, публиковать и т.п., но это совершенно другая задача, к VS Code имеющая отношения в процентов 5%.
Мне кажется каждому разработчику хочется выпустить продукт, которым бы пользовались люди
Поэтому в VS Code marketplace уже пятьсот snippet extensions.
Не понятно чем тут можно выделиться чтобы хоть кто-то твоей версией захотел пользоваться.Стоит у ларька бандит: бритый, в спортивных штанах, etc.
Подходит панк, весь такой прикинутый. Бандит ему в ухо пальцем тычет
спрашивает:
— А чо это у тебя серьга в ухе?
— Да вот, ношу.
— А волосы чо зеленые?
— Покрасил.
— А на хрен тебе все это?
— Понимаешь, я чем-то отличаюсь от других, выделяюсь.
Бандит стучит себе пальцем по бритой репе и говорит:
— Умом надо выделяться, умом!
NeZanyat
12.06.2019 23:16Осторожно! Используется Terminal!Это ж не для орнитологов сайт. Большинство людей здесь с удовольствием пользуются терминалом, остальные прекрасно знают что это и для чего. Я понимаю что это юмор, но то на чем он основывается нахожу оскорбительным.
Fi1osof
13.06.2019 02:45Спасибо большое!
Изложение не особо важно. Я просто не знал про эту фишку. Теперь поэкономлю дополнительное время:)
Zenitchik
Если тебе часто приходится делать copy/paste — значит ты делаешь что-то не так.
The_Pavlikovich Автор
Я понимаю о чем вы. Но нельзя отрицать что есть какие-то типичные блоки кода (а правильнее даже — конструкции) без которых сложно справиться.
Zenitchik
Хм… Наверно, Вы правы, хотя я лично никогда не сталкивался с тем, чтобы какой-то повторяющийся блок нельзя было оформить в отдельную функцию или генератор.
nochkin
«Повторяющийся код» может быть не обязательно из этого проекта, а совсем из другого. Для это и есть сниппеты, что бы не писать один и тот же код заново когда начинаешь новый проект.
The_Pavlikovich Автор
Не могу не согласиться. Ваша формулировка более точна.
Zenitchik
Тогда логично обособить его в отдельный модуль и импортировать?
technic93
Так snippets это не про это. Это не про использования кода, это про объявление кода. Например обявление класса, начинаешь писать
cla...и тебе сразу объявлние класса вылазит, с конструктором, и только подставляешь значение имени класса один раз. Но это такой тривиальный пример. Или там try/except сразу парой. Возможно более сложные случаи, посмотрите гифку на сайте vscode.MaM