An up-to-date list of the best Angular visual studio code extensions found currently.
I have been using Angular since it was in beta and my go-to editor has been VS Code since then.
I strongly recommend you to give it a try if you have not used it before especially if you are working on frontend projects and Typescript.
Reasons to try it out:
One of the crucial factors that helps us developers decide on an editor 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 Angular 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 2018:
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.
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.
Automatically finds, parses and provides code actions and code completion for all available imports.
Adds code snippets for Angular for TypeScript and HTML.
Another Angular code snippets for TypeScript and HTML. Quite similar to John Papa’s Angular v5 Snippets but has some minor differences. My recommendation is to try both and see which one you like more.
Adds intellisense for Angular templates.
These extensions are my personal favorites which I find very helpful anytime I write angular code.
I like to write my templates inline as much as I can and if you do too then this extension and the next one are essential for you.
angular2-inline offers syntax highlighting of inline html and css as well as code completion, highlighting, and hover information for inline html.
Emmet is one of these things that boosted my productivity tremendously, this extension adds it for angular inline templates.
I have been using angular material in couple of projects by now and I found this extension quite helpful.
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!
I stumbled upon this extension recently and I absolutely love it! It makes writing unit tests for your Angular code a lot easier where it generates all the boilerplate code for you and you just have to write the specific tests you need. It has a couple of hiccups but its constantly under development.
This one makes navigating between the component’s files a breath.
These extensions are more generic but I strongly recommend checking them out.
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.
Awesome for maintaining consistent configurations for VS Code.
That is it folks, happy productive coding!
You can find a similar 2019 list for Vue here.