如何在VSCode中查看TypeScript交叉类型的最终字面量并显示全部属性

一、把交叉类型展开为完整字面量形式 #

如果想让C = A & B这类交叉类型在悬停时直接显示展开后的结构，可以自定义工具类型强制TypeScript计算最终类型：

浅层展开（适用于单层交叉） #

type Expand<T> = T extends infer O ? { [K in keyof O]: O[K] } : never;

// 替换原定义，用Expand包裹交叉类型
type C = Expand<A & B>;

深层展开（适用于嵌套交叉类型） #

如果类型包含嵌套的交叉结构，用递归版本的工具类型：

type ExpandDeep<T> = T extends object 
  ? T extends infer O ? { [K in keyof O]: ExpandDeep<O[K]> } : never
  : T;

type C = ExpandDeep<A & B>;

修改后再悬停C，VSCode就会直接展示所有合并后的属性，不再显示交叉类型的组合形式。

二、让IntelliSense显示全部属性，取消折叠 #

VSCode默认会折叠过多属性，取消这个限制需修改以下设置：

• 打开VSCode设置（快捷键Ctrl+, / Cmd+,）
• 搜索typescript.preferences.maximumCompletions，将值设为足够大的数（比如10000）
• 再搜索typescript.preferences.maximumItemsInCompletions，同样设置为大数
• 确保typescript.preferences.showInferredType设为true

也可以直接在settings.json中添加配置：

{
  "typescript.preferences.maximumCompletions": 10000,
  "typescript.preferences.maximumItemsInCompletions": 10000,
  "typescript.preferences.showInferredType": true
}

设置完成后，不管类型有多少个属性，都会全部显示，不会再出现... X more ...的折叠提示。

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