; last updated - 2 minutes read

Many people ask me which Angular plugins I'm using. So here's my list. Most of these plugins are part of John Papa's Angular Essentials, the Angular Productivity Pack, and the TypeScript Extension Pack. You only need to install these plugins individually if you've behind a restrictive Firewall which doesn't allow you to install plugins from Visual Studio Code.

"Live-saver" plugins

These plugins make the difference between a glorified VI editor and a full-featured IDE:

Extension Pack Name and marketplace URL Description
p42 - Refactoring Hints & Automation120 useful refactorings for TypeScript and JavaScript.
JS CodeFormerAnother useful set of refactorings for TypeScript and JavaScript. I'm using it less often than the p42 plugin, but it seems to be rock-solid, too.
Angular Extension PackVisual Studio IntelliCodeAI assisted autocompletion
Angular Extension PackAngular Language ServiceAutocompletion for HTML
Angular Productivity PackHTML SCSS SupportAutocompletion for SCSS
Angular Productivity Packnpm IntellisenseAutocompletion for import statements
Angular Extension PackPath IntellisenseAutocompleting filenames
Angular Extension PackAngular SchematicsUI for the ng generate commands
Angular Extension PackESLintESLint integration
Angular Extension PackTSLintTSLint integration
Angular Extension PackEditorConfig for VS CodeAdd EditorConfig support
Angular Productivity PackNode npmValidate the package.json
Angular Extension PackPrettierPretter code formatting
Angular Extension PackAuto Rename TagRename paired HTML tags
JestSupport for tests written with Jest
Angular Extension PackMaterial Icon ThemeMakes your explorer tree look a lot better
Angular Extension PackPaste Json as TypeScript codeConvert Json to TypeScript interfaces
Angular Productivity PackSmoothTypelet's the cursor move smoothly
Angular Extension PackMove TSUpdates imports when moving TypeScript files
Angular Productivity PackstylelintLinter for CSS/SCSS
Angular Productivity PackGitlensVisualize code authorship at a glance

Most plugins are part of more than one of the extension packs. I only mentioned one of the for the sake of brevity.

Less frequently used plugins

There are also a couple of plugins I don't consider essential, but when you need them, they are very useful.

Extension Pack Name and marketplace URL Description
Markdown All in OneSupport for Markdown
Angular Extension PackTypeScript HeroOrganize imports
Angular Extension PackPeacock for Visual Studio CodeRunning multiple instances of VS simultaneously? This plugin distinguishes them by different colors.
Save without formatAdditional shortcut for those who use "format on save" and need to circumvent formatting
Sort Typescript importsTidiying up your imports

Comments