Here we explore shortly top 3 Plugins for VueJS Development in VSCode. Note that we left out vuedevtools, since it is not a VSCode Plugin, but a very powerful tool indeed.
#1: Vetur
Vetur is THE Plugin for VSCode that makes your life easier. The most important part of it is the autocomplete feature. It will auto recognize your data and computed properties. That way be able to use autocomplete on your variables, that were defined in another part of your VueJS Object (data, computed).
Download: https://marketplace.visualstudio.com/items?itemName=octref.vetur
HOW TO BECOME A VUE.JS DEVELOPER?
We’ve got something for you. Check out the VueJS Junior Course. In this online course you will dive deep into how Components work and how you can quickly create a Vue.js Website. In this course we use the top 3 VueJS Plugins, displayed in this Post.
#2: Vue 2 Snippets
Now Vue 2 Snippets makes your life easier if you are starting with a new project or if you like to experiment. In both cases, the plugin has a great variety of Code Snippets that will save you a lot of typing and remembering. As an example below: Whenever you create a new Single File Component in VueJS (.vue File), you have to create a template, script and style tag. Now that becomes really annoying after a few Components. Vue 2 Snippets comes to help.
Download: https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets
#3: ESlint
Now the obvious part. As your code grows, it is beneficial to have style guidelines, so that your code looks the same everywhere. This will make you happy in the future when you will work on your Components again. ESLint will also make your Co-Workers happy for a readable code.
Download: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
For Debugging Tools refer to: https://vuejs.org/v2/cookbook/debugging-in-vscode.html
3 VSCode Plugins for VueJS
0 Comments