VS Code Vue <template> <script> <style> autosuggestion

It's been a time since I have been programming with Vue. But when I started entering something like vuedef in a newly created .vue file it auto-suggested me the following instead of writing it all on my own:

<template>
</template>

<script>
</script>

<style>
</style>

I can't remember how I did that but I guess it was a certain word I had to type.
Maybe it comes from an VS-Code Addon?

Solution

vuedef comes with Vetur: https://marketplace.visualstudio.com/items?itemName=octref.vetur

For any modern Vue3 apps, you can use Volar (it's officially the one to use now too): https://marketplace.visualstudio.com/items?itemName=Vue.volar

Those 2 are also quite nice:

Vue3 snippets: https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets
Vue snippets: https://marketplace.visualstudio.com/items?itemName=sdras.vue-vscode-snippets

You should have plenty of choice after that!

You can also create your own snippets of course directly into VScode: https://code.visualstudio.com/docs/editor/userdefinedsnippets#_create-your-own-snippets