类型声明文件如何写？

问题：我们在写ts的时候会用打包工具将ts转成js，那么我们ts里声明的一些接口的类型就会丢掉，如果别人的ts引用我们的js，就会出现问题，它不知道我们的类型
解决办法：在打包的时候，同时生成一个类型声明文件***d.ts，别人的ts在使用我们的js的同时也要使用我们的d.ts就可以知道我们的类型了

d.ts生成途径

1. 用别人的声明文件

• 使用社区定义# DefinitelyTyped
  也就是yarn add --dev @types/react

• 使用库自带的定义
  有些库自带声明文件，TS自己会去找

2. 自己写声明文件

• 如何生成*.d.ts

tsc index.ts -d

运行这个命令会同时生成.js和.d.ts两个文件

• 如何提供给别人使用 .d.ts
  (1). 库：在package.json添加types字段，对应值为你生成的.d.ts

(2). 社区：上传到DefinitelyTyped

• 给任意的js文件添加类型
  以一个简单的js代码为例
  add.js

function add(a, b) {
    return a + b
}
export default add

(1). require方式
因为我们要给它添加指定的类型，所以我们只能通过接口声明一个类型，然后通过require方法引入便于我们指定类型

interface V {
  (c: number, d: number) : number
}
const add: V = require('./add.js')

但是这样会报错

我们需要安装@types/node

yarn add @types/node

然后就可以按照我们指定的类型调用了，这时候如果我们的add里的两个参数不全都是number的就会报错

(2). import的方式
类型声明直接写在同文件名下的.d.ts里
add.d.ts

declare function a(c: number, d: number) : number;
export default a

1.ts

import add from './add.js'
add(1, 2)

• 如何添加window全局属性

declare global {
    interface Window { 
        server: string
    }
}

window.server = 'ccc'

注意：global属性必须在有export或import的文件里使用，否则会报错

• 如何修改React组件属性
  给react的属性添加新的取值

declare module 'react' {
 interface HTMLAttributes<T> extends React.DOMAttributes<T>{
   styleName?: string;
 }
 interface SVGAttributes<T> extends React.DOMAttributes<T>{
   styleName?: string;
 }
}