如何在index.d.ts中为同级文件夹中的js文件编写类型代码?

Question

如何在index.d.ts中为同级文件夹中的js文件编写类型代码，使得在其他项目使用时鼠标悬浮能看到类型？

我直接 declare js 文件导出的函数类型，在其他地方引用时没有类型提示，只有 import Fnc

test 比做一个工具库，我希望在 main.js 中引入test/index.js 中的函数或其他值时，能有类型提示，那么 index.d.ts中应该如何编写。

注：index.js 中已经导出 test 文件夹下所有的函数及变量

Answer 1

index.js:

export function add(a, n = 1) {
    return a + n
}

index.d.ts:

export function add(a: number, n?: number): number

main.ts:

import { add } from './test'

// (a: number, n?: number | undefined) => number
type T = typeof add

Answer 2

其实这边建议写成ts，然后可以让类型代码通过ts编译工具来生成，tsconfig.json有个配置，如下所示:

{
  "compilerOptions": {
    // 其它配置
    "declaration": true, // 这个配置用于生成
  },

}

然后执行tsc命令就可以生成ts类型定义了。

就算是js文件，也可以不用写具体的函数类型定义的，使用typeof操作符即可，比如你在js文件中导出一个a函数，如:

// index.js
export const a = (a,b) => a + b;

那你只需要在index.d.ts中导入，然后写如下代码，让ts编译工具去生成具体的类型定义即可:

// index.d.ts
import { a } from './index.js';
export type a = typeof a;