Яндекс.Метрика
qr-код - Как-то так стрелка - Как-то так
Экономика + ... пиктограмма - Как-то Так THIS     АКТУАЛЬНЫЕ ВЕЩИ - СВОИМИ СЛОВАМИ
Персональная помощь в бизнес-планировании и WEB-поддержке
+ WEB = Laravel + Vue + Inertia + Tailwind !

Сниппет VSCode - шаблон кода компонента при разработке проектов на Vue 3

Сниппет VSCode - шаблон кода компонента при разработке проектов на Vue 3

Чтобы не набирать постоянно шаблонный код со стандартным набором вложений (<template> </template><script> </script><style scoped></style>) при создании компонента в рабочей среде js фрейморка Vue 3 и ускорить процесс разработки, всё это дело можно автоматизировать.

Если вашим редактором кода (IDE) при разработке проектов Vue 3 является VSCode, то вывод шаблона для любого компонента в рабочих файлах осуществляется с помощью встроенных сниппетов.

Если в стандартном наборе сниппетов VSCode он отсутствует, его необходимо создать следующим путём.

Заходим в настройки VSCode.

создание и вывод сниппета шаблона компонента Vue 3 - 1

Нажимаем соответствующую кнопку создания нового сниппета.

создание и вывод сниппета шаблона компонента Vue 3 - 2

Указываем его наименование.

создание и вывод сниппета шаблона компонента Vue 3 - 3

Меняем закомментированный шаблон формата json на свой.

создание и вывод сниппета шаблона компонента Vue 3 - 4

Префиксом выводимого спниппета пускай будет vc.

создание и вывод сниппета шаблона компонента Vue 3 - 5

Чтобы проверить, что сниппет работает, создадим компонент vue.

создание и вывод сниппета шаблона компонента Vue 3 - 6

Начинаем вводить в файле нашего компонента первые символы vc.

Из выпадающего списка выбираем наш сниппет.

создание и вывод сниппета шаблона компонента Vue 3 - 7

Автоматически подгрузится наш шаблон компонента Vue 3.

создание и вывод сниппета шаблона компонента Vue 3 - 8

Чтобы не набирать ручками, шаблон компонента для сниппета можно взять отсюда.

Как в VSCode создать и вывести стандартный шаблон кода компонента при разработке проектов на Vue 3 - Как-то Так!

Подписывайтесь на мой телеграмм канал - Мои заметки - ЭКОНОМИКА +

Если у вас есть какая-либо потребность в решении определённой задачи, связанной с экономикой, финансами или web-разработкой     telegram или форма обратной связи

Administrator
733
0
Имя
E-mail
Рейтинг
Отзыв

Конвертер валют
RUB RUB-icon
USD USD-icon
EUR EUR-icon
CNY CNY-icon
BYN BYN-icon
UAH UAH-icon
KZT KZT-icon
SHORT - о чём речь
ЭКОНОМИЧЕСКАЯ ГРАМОТНОСТЬ
Хочу Всё Знать. Полезные Советы