How to generate TypeScript UML class diagrams in VS Code?

class-diagram, typescript, uml, visual-studio-code

Solution

Using UML Diagram feature introduced by IntelliJ Editor by Jetbrains and it works very well with typescript.

Open the Diagram Popup

Go to Settings >>> Search for uml and find the keyboard shortcut for it.

OR

Right Click on a class name >>> Diagrams >>> Show Diagram Popup

Show class properties and methods:

Righ Click on the diagram popup >>> Show Categories >>> Methods `or` Properties

Tips

- You will find many options to show through the right click on the diagram popup.

You can zoom on the diagram objects (If there are too much details) by holding the Alt key when hovering on them

Problem

Original source