TypeScript Twoslash

A markup format for TypeScript code, ideal for creating self-contained code samples which let the TypeScript compiler do the extra leg-work.

If you know TypeScript, you basically know twoslash.

Twoslash adds the ability to declare tsconfig options inline, split a sample into multiple files and a few other useful commands. You can see the full API inside the README

The Twoslash markup language helps with:

  • Enforcing accurate errors from a TypeScript code sample, and leaving the messaging to the compiler
  • Splitting a code sample to hide distracting code
  • Declaratively highlighting symbols in your code sample
  • Replacing code with the results of transpilation to different files, or ancillary files like .d.ts or .map files
  • Handle multi-file imports in a single code sample
  • Creating a playground link for the code

Markup

See how TS Twoslash will grab the highlight information for identifiers in your code

Downloading Sandbox...

Highlights runtime types
Show Errors
Set Compiler Flags
Trims code
Show the JS
Show the DTS
Highlights

Results

Usage

Twoslash's usage guide is available on the npm README at @typescript/twoslash.