VS Code - Favorite Extension - Angular 2 Switcher

In this series, we are looking at some of my favorite VS Code extensions.

Extensions in VS Code are invaluable to speed up your work and make you more productive.

In this post, we will look at Angular2 Switcher which provides shortcuts to switch between the TypeScript, StyleSheet, Spec, and Html files for your Angular files.

Why You Need Angular2 Switcher

When coding using Angular, I frequently switch between my template (html), stylesheet (scss), and typescript (.ts). To switch files, I have to open up the sidebar, mousing over to the file, and clicking to open it. However, I find mousing aggravates my shoulder, so anything I can do to avoid mousing is awesome.

With Angular2 Switcher, you get keyboard shortcuts to switch between the files.

Usage

Here are the keyboard shortcuts for Windows and Mac.

Action	Windows	Mac
go to `.html` if on `.html` then go to previous	alt+o	shift+alt+o
go to `.css` if on `.css` then go to previous	alt+i	shift+alt+i
go to `.ts` if on `.ts` then go to previous	alt+u	shift+alt+u
go to `.spec.ts` if on `.spec.ts` then go to previous	alt+p	shift+alt+p

If you have a StreamDeck, you can also add buttons for the shortcuts so that you dont have to remember the shortcuts. Yes, I know you are leaving the keyboard to use the StreamDeck, but pushing a button doesn’t bother me like mousing does.

More Details and Install

You can read more details about the usage and install Angular2 Switcher at the VS Code Market Place