TypeScript Regions

matthewbill

Matthew Bill

Posted on September 23, 2024

TypeScript Regions

For those coming to TypeScript from C# you might have become used to regions as a way to organize code. These also exist within TypeScript/VSCode:

Using Regions

You can define regions of code that can be expanded/collapsed like the following:

Image description

This allows you to order functions of larger files and reduce what you have visible on screen.

Image description

Minimap

Regions appear in the minimap (although formatted strangely)

Image description

Outline

At the moment the regions don't appear in the outline, which is a shame:

Image description

There is an issue raised for this on GitHub, but it has been closed as there are no current plans to improve this:

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

Folding/Unfolding

You can fold and unfold all regions through the command pallet and through shortcuts (though not the easiest to remember).

Image description

💖 💪 🙅 🚩
matthewbill
Matthew Bill

Posted on September 23, 2024

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

TypeScript Regions
webdev TypeScript Regions

September 23, 2024