d.ts 타입 정리 파일

---

타입 저장 <수동>

export type Age = number;
export type multiply = (x :number ,y :number) => number
export interface Person { name : string }

1. d.ts를 확장자로 하여 파일을 생성한다

2. type 키워드나 interface를 정리해 두는 곳이다.

3. export를 사용해야 전역모듈로 사용할 수 있다.

---

타입 저장 <자동>

(tsconfig.json)

{
    "compilerOptions": {
        "declaration": true,
    }
}

1. config파일에 declaration을 true로 설정

=> ts파일마다 d.ts파일이 자동생성되며 타입이 정리되어 있음.

(index.ts)

let 이름 :string = 'hong';
let 나이 = 20;
interface Person { name : string } 
let 사람 :Person = { name : 'park' }

이렇게 작성한 ts파일이

(index.d.ts)

declare let 이름: string;
declare let 나이: number;
interface Person {
    name: string;
}
declare let 사람: Person;

d.ts파일로 생성되고 타입정리가 자동으로 된다.

---

글로벌 모듈 d.ts 만들기

1. 프로젝트에 type/common 폴더를 두 개 만든다.

2. config파일에 아래와 같이 작성한다.

"typeRoots": ["./types"] //글로벌 모듈 생성

=> ts파일을 작성할 때 타입이 없으면 자동으로 여기서 타입을 찾아서 적용해 준다.

---

외부 js 라이브러리 사용 시

https://www.typescriptlang.org/dt/search?search= 

Search for typed packages

=> 위 링크에 들어가면 타입이 정의된 npm 패키지를 찾을 수 있고, 설치하는 npm 명령어가 있다.

 

1. 보통 npm으로 라이브러리 설치 시, node_modules/@types 경로에 타입이 설치가 된다.

2. 타입스크립트 컴파일러는 이 경로를 통해 자동으로 타입을 가져온다.

3. 타입파일이 제공되지 않는 라이브러리의 경우, 따로 타입 부분만 설치해야 한다.

4. jQuery의 경우 아래의 명령어를 터미널에 입력한다.

npm install --save @types/jquery

 

5. @types 파일에 타입이 강제로 설치가 된다.

---

타입을 따로 보관하는 개념은 정말 좋은데, 자동생성 기능은 뭔가 믿을 수 없을 것 같다.

개인적으로는 따로 수동작업을 하는 편이 편할 것 같다.. 특히 파일이 많아지면 섞이고 위험해 보인다!