Simply right click in the explorer where you would normally create a new file and you will be presented with an additional list of generate options. It simply extends functionality of the Angular CLI directly into the VS Code explorer by providing shortcut menu items to create new Angular files. Link: Angular TypeScript Snippets for VS Code Angular FilesĪngular Files is another extension that you will come to love if you aren’t already using it. For example if I wanted to scaffold a new module, I simply type a-module and select the snippet.Īs you can see from the screenshot below, the snippet code is provided and ready to customize for your own use case. Once installed you simply start typing a- (a dash) and the snippet name. This excellent extension written by John Papa provides a great way to access shortcut snippets of Angular code that are commonly used in development ranging from Typescript snippets to Ngrx, JavaScript and HTML. Hopefully you will find these extensions as useful I do. Choose the extension name from the list and once installed reload/restart Visual Studio Code. To install them, simply start VS Code and open the command palette (Ctrl- Shift-P) Windows / Linux or (Cmd- Shift-P) Mac, and select Install Extension. I’ve included my favorite top ten with their descriptions and links below. There are a number of extensions that I have come to rely on that greatly simplify my development workflow listed below.

If you haven’t been using Visual Studio Code, I highly recommend checking it out. If you’ve been doing any development in Angular, the chances are you have been using Visual Studio Code (VS Code) for your editor.

Visual studio code editor for angular