如何让TypeScript显示完整的类型错误与定义而非折叠内容？

在TypeScript里查看类型定义或者排查类型错误时，经常会碰到... 20 more ...这类无法点击展开的折叠内容，调试起来特别费劲。目前已经通过ExpandRecursively工具类型展开了部分类型定义，但类型错误信息里的联合类型还是会被折叠，比如... 21 more ...、29 more这类，得想办法让错误信息也完整显示所有类型内容。

折叠的类型定义示例 #

const yx: undefined[] | string[] | number[] | ({
    partial: true;
    children: (... | {
        complete: boolean;
        partial: false;
        dive: boolean;
        like: AST.Term;
        name: string;
        nest: ...[];
    } | {
        partial: true;
        children: string[];
        like: AST.String;
    } | {
        ...;
    })[];
    like: AST.Term;
} | ... 6 more ... | {
    ...;
})[] | ... 20 more ... | ({
    partial: true;
    children: (... | {
        complete: boolean;
        partial: false;
        dive: boolean;
        like: AST.Term;
        name: string;
        nest: ...[];
    } | {
        partial: true;
        children: string[];
        like: AST.String;
    } | {
        ...;
    })[];
    like: AST.Term;
} | ... 2 more ... | {
    ...;
})[]

当前使用的ExpandRecursively工具类型 #

const yx: ExpandRecursively<X['children']>

// 展开对象类型到一级深度
export type Expand<T> = T extends infer O
  ? { [K in keyof O]: O[K] }
  : never

// 递归展开对象类型
export type ExpandRecursively<T> = T extends object
  ? T extends infer O
    ? { [K in keyof O]: ExpandRecursively<O[K]> }
    : never
  : T

折叠的类型错误信息示例 #

Argument of type 'X' is not assignable to parameter of type 'X["children"]'.
  Type 'ASTPartialType<AST>' is not assignable to type 'X["children"]'.
    Type 'ASTTemplate_PartialType' is not assignable to type 'X["children"]'.
      Type 'ASTTemplate_PartialType' is not assignable to type '(ASTInput_PartialType | ASTTerm_Type)[] | (ASTTerm_Type | ASTClassReference_Type)[] | (ASTTerm_Type | ASTString_Type)[] | ... 21 more ... | number[]'.
        Type 'X' is not assignable to type '(ASTInput_PartialType | ASTTerm_Type)[] | (ASTTerm_Type | ASTClassReference_Type)[] | (ASTTerm_Type | ASTString_Type)[] | ... 21 more ... | number[]'.
          Type 'ASTPartialType<AST>' is not assignable to type '(ASTInput_PartialType | ASTTerm_Type)[] | (ASTTerm_Type | ASTClassReference_Type)[] | (ASTTerm_Type | ASTString_Type)[] | ... 21 more ... | number[]'.
            Type 'ASTTemplate_PartialType' is not assignable to type '(ASTInput_PartialType | ASTTerm_Type)[] | (ASTTerm_Type | ASTClassReference_Type)[] | (ASTTerm_Type | ASTString_Type)[] | ... 21 more ... | number[]'.
              Type 'X' is not assignable to type 'number[]'.
                Type 'ASTPartialType<AST>' is not assignable to type 'number[]'.
                  Type 'ASTTemplate_PartialType' is missing the following properties from type 'number[]': length, pop, push, concat, and 29 more.

解决方法 #

1. 修改TypeScript配置，禁止错误信息截断 #

在tsconfig.json里添加或修改以下配置，让TypeScript不截断错误信息：

{
  "compilerOptions": {
    "noErrorTruncation": true,
    "extendedDiagnostics": false // 可选，开启会显示更多编译诊断信息
  }
}

如果是用命令行编译，直接加参数：

tsc --noErrorTruncation

这个配置能让错误信息里的联合类型完整显示，不会再出现... N more ...。

2. 增强类型展开工具，覆盖联合类型 #

原来的ExpandRecursively只处理对象类型，对联合类型的展开支持不足，我们可以扩展工具类型，让它递归展开联合类型的每个分支：

// 递归展开所有类型，包括联合类型和数组
export type ExpandFull<T> = 
  T extends object 
    ? T extends infer O 
      ? { [K in keyof O]: ExpandFull<O[K]> } 
      : never 
    : T extends infer U 
      ? U extends unknown[] 
        ? ExpandFull<U[number]>[] 
        : U 
      : never;

// 使用示例
const yx: ExpandFull<X['children']>;

用ExpandFull代替原来的ExpandRecursively，定义变量时就能看到完全展开的类型，错误信息里也会显示完整的联合类型分支。

3. 临时断言触发完整类型显示 #

如果只是临时调试，不想改全局配置或工具类型，可以定义一个临时类型别名，然后用never类型触发错误，强制TypeScript显示完整类型：

// 先展开目标类型
type FullChildren = ExpandFull<X['children']>;
// 触发错误，让TypeScript输出完整的FullChildren类型
const _debug: never = {} as FullChildren;

此时TypeScript会在错误提示里把FullChildren的所有分支都列出来，不会截断。

内容的提问来源于stack exchange，提问作者Lance Pollard