Чтобы не набирать постоянно шаблонный код со стандартным набором вложений (<template> </template><script> </script><style scoped></style>) при создании компонента в рабочей среде js фрейморка Vue 3 и ускорить процесс разработки, всё это дело можно автоматизировать.
Если вашим редактором кода (IDE) при разработке проектов Vue 3 является VSCode, то вывод шаблона для любого компонента в рабочих файлах осуществляется с помощью встроенных сниппетов.
Если в стандартном наборе сниппетов VSCode он отсутствует, его необходимо создать следующим путём.
Заходим в настройки VSCode.
Нажимаем соответствующую кнопку создания нового сниппета.
Указываем его наименование.
Меняем закомментированный шаблон формата json на свой.
Префиксом выводимого спниппета пускай будет vc.
Чтобы проверить, что сниппет работает, создадим компонент vue.
Начинаем вводить в файле нашего компонента первые символы vc.
Из выпадающего списка выбираем наш сниппет.
Автоматически подгрузится наш шаблон компонента Vue 3.
Чтобы не набирать ручками, шаблон компонента для сниппета можно взять отсюда.
Как в VSCode создать и вывести стандартный шаблон кода компонента при разработке проектов на Vue 3 - Как-то Так!
