(21.07.15) d.ts 파일이란??

작은 지식이라도, 하루에 하나씩.

 

---

 

내용을 보강한 포스트가 발행되었습니다. 

https://spookyjelly.tistory.com/83

[예전 글 다시쓰기] .d.ts 파일이란?

 

 

 

한 줄 요약

---

🔑.d.ts 파일은 기존 JS 모듈을 타입스크립트에서 사용하기 용이하도록 기존 JS 모듈의 타입정보를 별도의 파일로 선언한것🔑

 

🧨d.ts 파일은 타입선언만 이루어짐을 유의🧨

사용자가 직접 만들 수 도 있지만, 이미 존재하는 .d.ts를 가져다 쓸 수도 있다.

나도 알게 모르게 이미 존재하고 있는 .d.ts 파일들을 가져다 썼었다!

 

npm install @types/react-native

이 명령어가 타입 선언만 포함하는 모듈을 받아오는 것이였다!

@types가 있기 때문에 컴파일러가 자동으로 타입체크도 하고, 자동완성도 해주고 하는 것이다.

 

타입 선언이 없는 모듈의 @types를 만들어서 npm에 올리면 좋겠지만, 시간과 노력이 너무나도 많이 든다.

→ 필요한 부분만 만들어서 쓰는 것이 효율적

 

d.ts 작성법

---

• @types 안에 해당 모듈명의 디렉토리 생성
• 생성한 디렉토리 안에 index.d.ts 생성
• export 할 타입의 인터페이스 선언
• 해당 인터페이스 타입의 변수 (상수 무관) 선언
• export 선언

d.ts가 아닌 일반 ts 파일 내에서도 declare global로 선언해도 된다

 

함수와 생성자의 타입 선언

---

• 함수나 생성자도 interface로 선언가능
• 오버로딩 가능

 

Ambient Module 이란?

---

한 마디로 어디서든 사용할 수 있는 type 정의

third party library는 이 방식을 사용하고 있다.

 

 

참고

---

• 모듈 (declate module 'module-name' {...}) 바깥의 declare는 전역으로 인식됨
  • import 없이 사용해도 컴파일 오류는 발생하지 않으나, 동작하지는 않음
• 한 개의 index.d.ts 파일에 여러개의 declare module을 선언할 수 있다