TypeScript模块声明中如何正确使用映射类型？

问题原因 #

你遇到的报错是语法规则不匹配导致的，核心错误点有两个：

• 映射语法[K in keyof T]不能和普通固定字段、调用签名写在同一个对象类型声明块内，必须拆分为独立映射类型，再通过&交叉类型合并其他字段
• 返回值写法() => <T[K]>存在语法错误，返回值类型不需要包裹尖括号，直接写T[K]即可

正确实现代码 #

declare module "deferred-regl"{
  import { Regl } from 'regl'

  // 拆分三部分：自定义字段 + 调用签名 + 映射包装原T的所有属性为函数返回
  type IDregl<T> = {
    setRegl: (regl?: Regl) => void
    queue: any[]
    setQueue: (queuInput: any[]) => void
  } & {
    // 调用签名单独放一个交叉块
    (): IDregl<Regl>
  } & {
    // 映射类型单独定义，把T所有属性包装为返回对应值的函数
    [K in keyof T]: () => T[K]
  };

  export default function defRegl(): IDregl<Regl>
}

实现说明 #

• 最终生成的IDregl<Regl>会同时包含你新增的3个自定义方法、可调用签名，以及Regl类型上所有原有属性，且原有属性的类型都会被包装为() => 原属性类型，完全匹配你的需求
• 这种交叉映射类型的写法无法用interface实现，是TypeScript中批量重写继承类型所有属性的标准方案

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