TypeScript ts-expect-error 怎么用

TypeScript ts-expect-error 怎么用

你有没有过这种经历？写 TypeScript 代码的时候，明明知道某个地方会报错，但又不想让 TS 编译器一直揪着这个错误不放——比如你正在测试一段逻辑，或者某个暂时不想改的第三方库调用。这时候，ts-expect-error 就能派上用场了。它就像代码里的一个“临时免责符”，告诉 TS：“这里我知道会报错，先别炸毛，等我处理完再回来改”。

先搞懂它和普通注释的区别

很多人会用普通的 // @ts-ignore 来忽略错误，但 ts-expect-error 和它可不是一回事儿。举个生活化的例子：你订奶茶的时候，要是跟店员说“我不要珍珠”（对应 @ts-ignore），不管你点的本来就没珍珠，还是点错了有珍珠，店员都会直接给你做；但要是你说“我今天不想喝珍珠，要是给我加了我就找你算”（对应 ts-expect-error），结果就不一样了——如果最后真的给你加了珍珠，店员就得返工，要是没加，那就万事大吉。

换到代码里就是：ts-expect-error 有个“校验机制”，如果它标注的那一行其实没有报错，TS 编译器反而会再报一个新的错误——相当于提醒你“哎，你这地方说要报错，结果现在没问题了，别忘了把这个注释删掉”。而 @ts-ignore 不管对错，都直接忽略，很容易就把真正该改的错误给藏过去了。

具体怎么用？就这两步

第一步：精准贴在报错的代码行上面

它的使用场景非常明确，就是“我知道这一行会出 TS 错误，暂时先不管”，所以必须贴在报错代码的正上方，而且要写对格式——注意是两个斜杠加 @ts-expect-error，中间没有空格。

比如你写了一个简单的计算函数，本来应该传数字，但你故意传了字符串 '5'，TS 肯定会报错：类型“string”的参数不能赋给类型“number”的参数。这时候你就可以这么写：

`typescript

// 我知道这里传字符串会报错，先记下来

// @ts-expect-error

const result = add(5, '10');

`

这样 TS 就不会在这一行红波浪线，也不会编译报错了。

第二步：别偷懒，用完就删

刚才说的“珍珠校验”不是白设置的——如果哪天你把 add 函数改成支持数字和字符串都能传了，那刚才那一行就不会再报错，这时候 TS 就会报一个新错误，提醒你“这个 ts-expect-error 没用了，快删掉”。

还是刚才的例子，要是后来 add 函数改成了 const add = (a: number | string, b: number | string) => Number(a) + Number(b)，那 add(5, '10') 就没问题了，这时候 TS 会在 // @ts-expect-error 这一行红波浪线，告诉你“你之前说要报错的地方现在没问题了，删了这个注释吧”。

这些场景用它最省心

不是所有错误都适合用 ts-expect-error，但这几个场景用它就很合适：

• 临时调试代码：比如你想试试某个错误场景会不会触发，或者正在重构代码，有几行旧代码暂时不想动，又不想被 TS 的错误打断开发流程。
• 第三方库的类型问题：有些老的第三方库没有写好 TS 类型，调用的时候会报错，而且你暂时没时间给库提 PR，这时候用 ts-expect-error 临时顶一下，比用 @ts-ignore 安全。
• 预期内的错误测试：比如你写单元测试的时候，故意传错参数来验证函数的错误提示，这时候用 ts-expect-error 可以避免测试代码本身的 TS 报错。

别踩这些坑

有两个常见的错误用法一定要避免：

第一个是不要滥用，比如把它贴在整个文件的最上面，或者随便贴在一行不相关的代码上面——相当于跟店员说“我今天不要珍珠”，但你根本没点珍珠，店员反而要多检查一遍，反而添乱。

第二个是不要忘了删，要是项目里留着一堆没用的 ts-expect-error，时间久了连你自己都忘了哪些是临时的，等项目出问题的时候，反而找不到真正的错误。

简单说，ts-expect-error 就是个“临时补丁”，不是“永久解决方案”，用的时候搞懂它的校验逻辑，用完就收，就能帮你少踩很多 TS 的小坑。