Twoslash 类型提示

在代码块中显示 TypeScript 类型信息

180 字·1 分钟

Twoslash 是一个强大的工具，可以在代码示例中内联显示 TypeScript 类型信息，非常适合文档中的教学场景。

基础用法

在 TypeScript 或 JavaScript 代码围栏中，使用 // ^? 注释来查询表达式的类型：

const message = "hello, world"
//    ^?

Twoslash 会自动高亮代码中的类型错误：

const count: number = "not a number"

function identity<T>(arg: T): T {
  return arg
}

const result = identity("typescript")
//    ^?

interface User {
  id: number
  name: string
  email: string
  role: "admin" | "user" | "viewer"
}

可以使用 // ^| 来展开联合类型：

type Status = "idle" | "loading" | "success" | "error"

function getStatusLabel(status: Status): string {
  return status
//        ^|

16 / 16