At the time of writing this, my go-to editor is VS Code.
One of the crucial factors that helps us developers decide on which editor to use is the tooling support and the community around it and VS Code has both of these with an awesome community around it.
In this post I will be listing out all my favorite Vue VS Code extensions that have boosted my productivity while working on Vue applications.
I am aiming to keep this up to date as much as possible, so here is the list for 2019:
You can skip to the end of the page to find the full list with links.
These extensions are the must haves for any Vue developer in my opinion and all of them have been very popular recently.
Allows quickly jumping to or peeking into files that are referenced as components or modules
Integrates ESLint into VS Code
Makes you type less.
Automatically renames paired HTML/XML tag.
These extensions are my personal favorites which I find helpful anytime I write Vue code.
Integrates TSLint into VS Code. If you are not linting your code you should start doing it from today!
Bonus: Here is my own ts-linter config file which I try to keep up to date with the latest recommendations.
How many times you had to copy the API's json response and make interfaces out of it? This small extension will make this process smoother, you are welcome!
Allows quickly jumping to or peeking into files that are referenced as components or modules.
These extensions are more generic but I strongly recommend checking them out.
Allows you to toggle the formatter (Prettier, Beautify, …) ON and OFF with a simple click.
Automatically adds HTML/XML close tag.
Allows matching brackets to be identified with colors.
Supports running npm scripts defined in the package.json file and validating the installed modules against the dependencies defined in the package.json.
Autocompletes npm modules in import statements.
Awesome for maintaining consistent configurations for VS Code.
That is it folks, happy productive coding!
You can find a similar list for Angular here.