How to Console.log Typescript Type Output Value

Short answer is: You can’t

But there are other options! These options help you:

• Expand the … N more … values in your intellisense pop-up window

• Expand Type contracts to view all properties in a combined type without using the subtype names.

1 - Use Expanded Intellisense in VSCode

In your tsconfig.json add "noErrorTruncation": true, like so:

{
  "compilerOptions": {
    "noErrorTruncation": true,
    "target": "es2016",   
    ...
  }
}

Before Expanded Intellisense

After Expanded Intellisense

For more on this see this Stackoverflow thread

2 - Use Helper Functions

These are sourced from this stackoverflow thread

export type Expand<T> = T extends (...args: infer A) => infer R
  ? (...args: Expand<A>) => Expand<R>
  : T extends infer O
  ? { [K in keyof O]: O[K] }
  : never;

export type ExpandRecursively<T> = T extends (...args: infer A) => infer R
  ? (...args: ExpandRecursively<A>) => ExpandRecursively<R>
  : T extends object
  ? T extends infer O
    ? { [K in keyof O]: ExpandRecursively<O[K]> }
    : never
  : T;

Before Helper Functions

After Helper Functions

Did you know?

Typescript has a hard limit of 25 members when using union of mapped types?

If like me you didn’t and find it interesting you can read more about it here.

That’s all for now.

If you found this useful please like, share, or comment with other methods you use to inspect the expanded value of your typescript types.