如何在外层作用域获取更简洁精准的TypeScript类型报错?
长话短说:我希望找到一种在外层作用域下“简化”TypeScript报错信息的方法。
给定如下代码,可正常通过类型校验:
type HandlerReturnType = { x: number } type HandlerParams = { a: number } type Handler = (params: HandlerParams) => HandlerReturnType const handler: Handler = ({ a }) => ({ x: a })
当代码存在类型错误时,TypeScript抛出的报错信息层级嵌套过深,无法直接指向核心问题:
const handler: Handler = ({ a }) => { return { x: "string" } } // Type '({ a }: HandlerParams) => { x: string; }' is not assignable to type 'Handler'. // Call signature return types '{ x: string; }' and 'HandlerReturnType' are incompatible. // The types of 'x' are incompatible between these types. // Type 'string' is not assignable to type 'number'.(2322)
我希望TypeScript能输出更精准指向核心错误的报错,目前已知两种可实现该效果的方案,但都存在明显缺陷:
- 方案1:将类型标注移动到更近的作用域
示例代码:
缺陷:在复杂类型结构下写法过于冗余繁琐const handler = ({ a }: HandlerParams): HandlerReturnType => { return { x: "string" } } // Type 'string' is not assignable to type 'number'.(2322) // input.tsx(1, 28): The expected type comes from property 'x' which is declared here on type 'HandlerReturnType' - 方案2:使用箭头函数隐式返回值,在同作用域返回结果
示例代码:
缺陷:实现复杂业务逻辑时会严重降低代码可读性const handler: Handler = ({ a }) => ({ x: "string" }) // Type 'string' is not assignable to type 'number'.(2322) // input.tsx(1, 28): The expected type comes from property 'x' which is declared here on type 'HandlerReturnType'
我已清楚TypeScript输出繁简两类报错的底层逻辑,现寻求一种无需做出上述妥协(无冗余类型标注、不降低复杂逻辑代码可读性)即可获得简洁精准类型报错的实现方法。
内容的提问来源于stack exchange,提问作者Eliya Cohen
相关产品推荐
相关产品推荐

