Creating boilerplate snippets for VS Code
Tired of looking at a blank page when creating a new .vue file? VS Code snippets to the rescue!! Actually it supports more than us Vue. You can create snippets for any language but this article will focus on Vue (the template is for Vue 3 Composition API ). There is a bit of boiler plate when creating a Vue component and I didn't want to type it out each time. One solution is to use VS Code snippets. It has its own format but you wont have to worry about because there is a fantastic snippet generator by Pawel Grzybek to generate it for us. Here is an example I created. Once you have your snippet you want to add it to VS Code. On Windows, hit CTRL + ALT + P, then Locate "Configure User Snippets". Choose Vue.json Copy the snippet you generated between the { } curly brackets (see vue.json snippet below) Now you can Create a new file with a .vue extension Type vue3-default and press tab 🥳 PRESTO!! You have boiler plate Now have a coffee with your saved time ☕😊 Go ahe
