Top 10 Angular extensions to VS Code ( english article )

  • Post author:
  • Post category:Geral

Here’s a list of my Top 10 Angular VS Code Extensions

#10 Bracket Pair Colorizer
Keep your sanity when working with brackets and braces. Extremely useful while navigating code with mulitple arrow functions.

#9 HTML CSS Class Completion
Perfect for quickly decorating HTML with the project’s available class names. Unfortunately, the class names are not scoped to the component’s folder.

#8 Angular 2 TypeScript Emmet
If you haven’t learned Emmet yet it’s definitely something to put under your belt. This plugin allows you to use the syntax directly in component templates.

#7 angular2-inline
Provides syntax highlighting for CSS and HTML within inline templates.

#6 angular2-switcher
Quickly switch between component, template, and styles with three simple key bindings.
Also supports Go to Definition of template variables by simply pressing F12 while cursor is on variable.

#5 vscode-Icons
The best Icon Pack out there! Features Angular specific icons for pipes, directives, components, modules, routing, and services. Beautify the file explorer! 🙂

#4 TSLint
If you’re not linting TypeScript you should start, especially with codelyzer. This plugin makes it dead simple to see issues in you TypeScript code. It even provides auto fixes!

#3 Angular 2+ Snippets
This is the most comprehensive snippet pack I’ve seen. It features 67 different snippets.

#2 TypeScript Hero
This plugin manages import statements and can automatically import missing dependencies. Can organize and sort imports.

#1 Path Intellisense
If there’s one plugin you add make sure it’s this one. This plugin enables autocompletion to file paths, which provides a huge boost when dealing with import statements.

Well thats the end of the list. Hopefully, you found one or two extensions you didn’t know about.
Feel free to add in the comments below any extensions I missed. Also checkout my post on adding Project Recommend VS Code Extensions to help share these extensions with the team.