Angular Useful Extensions
These Angular extensions are most popular (and some of my favorite), And It’s Very useful and speeds up your Angular Development.
Protip: I have created the “Angular Useful Extension Pack” for the quick and easy one-click install all below-listed extensions.
Angular Useful Extension Pack: This package installs all below-listed extensions at a time that will be very useful during Angular development.
- Angular Schematics
It allows you to launch Angular schematics (CLI commands) with a Graphical User Interface, directly inside the VS Code!
2. angular2-switcher
Switch .ts/.html in angular2 project.
3. Auto Import
vs code extension that will automatically find, parses and provides code actions for all available imports.
4. Auto Rename Tag
Automatically rename paired HTML/XML tags, the same as Visual Studio IDE does.
5. angular2-inline
VSCode extension that adds syntax highlighting for inline Angular2 templates.
6. Angular Language Service
Its provide a rich editing experience for Angular templates, both inline and external templates
7. Better Comments
The Better Comments extension will help you create more human-friendly comments in your code.
8. Bookmarks
It helps you to navigate in your code, moving between important positions easily and quickly. No more need to search for code.
9. Bracket Pair Colorizer 2
This extension allows matching brackets to be identified with colors.
10. CSS Peek
A vs code extension for peeking at CSS definitions from a class or id tag in HTML
11. Code Spell Checker
A simple source code spell checker for typescript and javascript
12. Debugger for Chrome
Debug your JavaScript code running in Google Chrome from VS Code.
13. EditorConfig for VS Code
This plugin attempts to override user/workspace settings with settings found in .editorconfig files
14. GitLens — Git supercharged
Supercharge the Git capabilities built into Visual Studio Code
15. Git History
View git log, file history, compare branches or commits
16. JSON to TS
Convert JSON object to typescript interfaces
17. Move TS — Move TypeScript files and update relative imports
extension for moving typescript files and folders and updating relative imports in your workspace
18. Nx Console
Nx Console for Visual Studio Code. The user interface app for the Angular CLI
19. Path Intellisense
Visual Studio Code plugin that autocompletes filenames
20. Prettify JSON
Prettify ugly JSON inside VSCode
21. Peacock
Subtly change the workspace color of your workspace. Ideal when you have multiple VS Code instances and you want to quickly identify which is which.
22. Prettier — Code formatter
Prettier Formatter for Visual Studio Code Prettier is an opinionated code formatter.
23. TypeScript Toolbox
Generate Getter and/or Setter Extension for Visual Studio Code
24. TSLint
VS Code extension that provides TSLint support using the typescript-tslint-plugin
25. SCSS Formatter
SCSS Formatter is an extension for the Visual Studio Code to format SCSS.
26. SCSS IntelliSense
IntelliSense for Variables, Mixins, and Functions in all Sass (SCSS syntax only) files
27. SimonTest
SimonTest is an Angular test generator
28. SonarLint
SonarLint is an IDE extension that helps you detect and fix quality issues as you write code in JavaScript, TypeScript, Python, and PHP.
29. vscode-icons
If you like all the above extension please install “Angular Useful Extension Pack” on a single click.
There will be some other useful and powerful extensions that will be useful that I’m not aware of, please feel free to tell us.
Thanks for reading, Happy coding! :) (y)
