Getting Type Hierarchy working

Hi all,

I’ve been trying to get the Type Hierarchy feature working (with typescript) for quite a while now, and I’m not having much luck.

Here is my package.json:

    "private": true,
    "dependencies": {
      "@theia/callhierarchy": "latest",
      "@theia/console": "latest",
      "@theia/core": "latest",
      "@theia/debug": "latest",
      "@theia/editor": "latest",
      "@theia/editor-preview": "latest",
      "@theia/file-search": "latest",
      "@theia/filesystem": "latest",
      "@theia/getting-started": "latest",
      "@theia/git": "latest",
      "@theia/keymaps": "latest",
      "@theia/languages": "latest",
      "@theia/markers": "latest",
      "@theia/messages": "latest",
      "@theia/metrics": "latest",
      "@theia/mini-browser": "latest",
      "@theia/monaco": "latest",
      "@theia/navigator": "latest",
      "@theia/outline-view": "latest",
      "@theia/output": "latest",
      "@theia/plugin-dev": "latest",
      "@theia/plugin-ext": "latest",
      "@theia/plugin-ext-vscode": "latest",
      "@theia/plugin-metrics": "latest",
      "@theia/preferences": "latest",
      "@theia/preview": "latest",
      "@theia/process": "latest",
      "@theia/scm": "latest",
      "@theia/scm-extra": "latest",
      "@theia/search-in-workspace": "latest",
      "@theia/task": "latest",
      "@theia/terminal": "latest",
      "@theia/typehierarchy": "latest",
      "@theia/userstorage": "latest",
      "@theia/variable-resolver": "latest",
      "@theia/vsx-registry": "latest",
      "@theia/workspace": "latest",
      "@theia/typescript": "latest"
    "devDependencies": {
      "@theia/cli": "latest"
    "scripts": {
      "prepare": "yarn run clean && yarn build && yarn download:plugins",
      "clean": "theia clean",
      "build": "theia build --mode development",
      "start": "theia start --plugins=local-dir:plugins",
      "download:plugins": "theia download:plugins"
    "theiaPluginsDir": "plugins",
    "theiaPlugins": {
      "vscode-builtin-css": "",
      "vscode-builtin-html": "",
      "vscode-builtin-javascript": "",
      "vscode-builtin-json": "",
      "vscode-builtin-markdown": "",
      "vscode-builtin-npm": "",
      "vscode-builtin-scss": "",
      "vscode-builtin-typescript": "",
      "vscode-builtin-typescript-language-features": ""

(Installing on Windows 10 x64, no workspaces)

If I include @theia/typescript as above, the app actually fails to load (stuck on loading animation).
After removing @theia/typescript from the build, the app starts as expected, and I can see the Type Hierarchy widget, but when I right click on a variable/type within a .ts file, the focus switches to the Type Hierarchy widget but does not actually show anything.

Any idea how to get this working?

Thanks guys!


@BrotherCreamy please note that language-specific extensions such as @theia/typescript are deprecated in favor of using vscode extensions (as you’ve added correctly vscode-builtin-typescript-language-features). It is ultimately the reason why your application was stuck on the loading screen.

At the moment, there is no API from VS Code to support type hierarchy but it should be supported soon as tracked by the following issue:

Once the API is finalized and implemented, we can make use of our previous type hierarchy extension to visualize the hierarchy for multiple languages.

Hi Vince,

Thanks for your speedy reply on this.

Have you heard anything about when the API might be implemented by the VS Code team?


No problem, I haven’t heard anything concrete yet, I referenced the issue if you’d like to follow up with VS Code regarding implementing the API:

Cheers, will do.
Thanks again Vince!

1 Like