Angular编译中TypeScript Extract工具类型不符合预期问题

问题重现 #

代码示例：

private static doSomething(param: Extract<string | undefined, undefined>): void {}

this.doSomething(undefined);

• IDE（IntelliJ，TypeScript 4.8.4）无编译错误提示
• 启动Angular应用时触发编译错误：TS2345: Argument of type 'undefined' is not assignable to parameter of type 'never'
• 环境：Angular CLI 14.2.10，Angular编译器14.2.12，TypeScript 4.8.4

原因 #

这个问题的核心是Angular编译器（ngc）与TypeScript原生编译器在strictNullChecks关闭时的行为差异：

• 当strictNullChecks为false时，TypeScript会将string | undefined视为等同于string（直接忽略undefined类型），此时Extract<string, undefined>的结果就是never，导致参数类型不匹配。
• 你的IDE可能默认开启了strictNullChecks，所以能正确识别Extract<string | undefined, undefined>为undefined，但Angular编译时使用的tsconfig.json中该配置可能是关闭的。

解决方案 #

方案1：开启strictNullChecks #

修改项目根目录下的tsconfig.json，确保compilerOptions中包含：

{
  "compilerOptions": {
    "strictNullChecks": true,
    // 其他配置...
  }
}

开启后，Angular编译器会正确解析Extract<string | undefined, undefined>为undefined，编译错误会消失。

方案2：直接指定参数类型（无需依赖Extract） #

如果不想开启严格模式，可以直接将参数类型写为undefined，替代Extract工具类型：

private static doSomething(param: undefined): void {}

this.doSomething(undefined);

这种写法在strictNullChecks关闭时也能正常工作。

方案3：调整Extract的使用方式（兼容非严格模式） #

如果必须使用Extract，可以先确保联合类型在非严格模式下能被正确识别，比如用unknown兜底：

private static doSomething(param: Extract<string | undefined | unknown, undefined>): void {}

不过这种方式不够直观，更推荐前两种方案。

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