Skip to content

MarcoAntolini/ts-hover-prettify

Repository files navigation

ts-hover-prettify

This tool helps you make more readable and prettier hover tooltips for your Typescript code.

Usage

First, you need to install the package:

npm add -D ts-hover-prettify

And then you have to add a file prettify.d.ts to your project with the following content:

import 'ts-hover-prettify';

That's it! Now you can use it inside your project.

Example

Let's say you have a type like this:

type Intersected = {
  a: string;
} & {
  b: number;
} & {
  c: boolean;
};

Hovering over Intersected would show you the following tooltip:

/**
 * { a: string; } & { b: number; } & { c: boolean; }
 */

But wrapping it inside of Prettify you can make it more readable:

type Intersected = Prettify<
  {
    a: string;
  } & {
    b: number;
  } & {
    c: boolean;
  }
>;

/**
 * {
 *   a: string;
 *   b: number;
 *   c: boolean;
 * }
 */