TypeScript Regions – DEV Community

For those of you who have switched from C# to TypeScript, you may have become accustomed to regions as a way to organize code. These also exist within TypeScript/VSCode:

Using regions

You can define code areas that can be expanded/collapsed, as below:

This allows you to organize features of larger files and reduce the visible content on the screen.

Mini map

Regions appear in the minimap (although formatted strangely)

Overview

At the moment the regions are not visible in the outline, which is a shame:

There has been an issue reported about this on GitHub, but it has been closed as there are currently no plans to improve this:

https://github.com/microsoft/vscode/issues/51364

Fold/Unfold

You can expand and collapse all regions via the command palette and via shortcuts (although these aren’t the easiest to remember).