Awesome Angular Pack
A collection of useful, stable and best rated angular/typescript extensions, which build a productive IDE. If you are also a dotnetcore developer check out the Awesome Dotnetcore Pack, which reuses packages that offer support for both environments.
VSCode Angular TypeScript & Html Snippets
Visual Studio Code TypeScript and Html snippets and code examples for Angular 2,4,5 & 6. All code snippets are based on and follow the Angular style guide.
Angular schematics (CLI commands) from files Explorer or Command Palette.
Easily navigate to typescript(.ts)|template(.html)|style(.scss/.sass/.less/.css) in angular2 project.
Very lightweight language support for angular definitions.
An Angular test generator. It analyzes your code and creates the necessary stubs, configures the TestBed, and it even generates tests for you.
Material Icon Theme
The Material Icon Theme provides lots of icons based on Material Design for Visual Studio Code. It include seperate icon for example Angular-Services, Angular-Components, Angular-Directives,....
Integrates the tslint linter for the TypeScript language into VS Code.
Move TS README
Supports moving typescript files and updating relative imports within the workspace.
Paste JSON as Code
Show TODO, FIXME, etc. comment tags in a tree view
"Comment TS" generates a template for JSDoc comments. It is adapted for TypeScript files. Typescript comes with a lot of language annotations, which should not be duplicated in the comments. Most likely this would lead to inconsistencies. If you like a todo in your generated comments:
IntelliSense for CSS class names in HTML
CSS class name completion for the HTML class attribute based on the definitions found in your workspace.
Auto Close Tag
Automatically add HTML/XML close tag, same as Visual Studio IDE or Sublime Text does.
If you like to exclude typescript (collides with explicit type conversions):
- Auto Rename Tag
Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.
This extension validates the installed modules against the dependencies defined in the package.json.
Shows package version information for npm, jspm, bower, dub and dotnet core in the Visual Studio Code editor.
This plugin attempts to override user/workspace settings with settings found in .editorconfig files. No additional or vscode-specific files are required. As with any EditorConfig plugin, if root=true is not specified, EditorConfig will continue to look for an .editorconfig file outside of the project.
GitLens supercharges the Git capabilities built into Visual Studio Code. It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more. If you don't like the gitlens on the current line set:
Debugger for Chrome
Visual Studio Code plugin that autocompletes filenames.
Offers more copy options: Copies text without syntax highlighting, optionally adds metainfo like document name and date.
Recommended Tools (not included)
Display import/require package size in the editor
Bracket Pair Colorizer
This extension allows matching brackets to be identified with colours. The user can define which characters to match, and which colours to use.
With this extension, you will be able to categorise your annotations into: Alerts, Queries, TODOs, Highlights,...
Commented out code can also be styled to make it clear the code shouldn't be there.
Generate your Angular project documentation in seconds.
A documentation generator for TypeScript projects.
- If you do not like vs code telemetry set:
- All NPM scripts to start in the explorer view:
- Organize imports on file save:
- If you do not need 'open editors' and like to use the space for your project files:
- Auto save on leaving the editor:
- Enhanced minimap performance by disabling render characters in minimap:
- Makes the corresponding js and source map files invisible: