declare

02/11

 

declare 란

TypeScript 에서 delclare 키워드는, 컴파일러에게 이 변수 / 함수 / 클래스 / 모듈 이 어딘가 다른 곳(일반적으로 JavaScript 파일 혹은 런타임 환경) 에 이미 정의되어 있으니, JavaScript 코드로 컴파일할 필요는 없다 라고 알려주는 역할만을 수행한다.

다시 말해, 실제 구현 코드를 생성하지 않고, 타입 정보만을 제공하는 엠비언트 선언(Ambient Declaration) 에 사용하는 것.
엠비언트 선언은 TypeScript 의 주요 목표인, 방대한 JavaScript 생태계와 상호 운용되기 위해 타입만 선언하며, 타입 시스템의 일관성을 유지하면서도 기존 JavaScript 리소스를 활용할 수 있게 하는 개념이다.

 

주요 용도

기존 JavaScript 라이브러리 연동
jQuery 와 같은 외부 JS 라이브러리를 TS 프로젝트에서 사용할 때, TS 는 해당 라이브러리의 존재나 타입 정보를 알지 못해 컴파일 오류가 발생한다. declare 를 사용해 해당 라이브러리의 전역변수나 함수가 존재한다고 선언 가능.

.d.ts 파일 (타입 선언 파일)
declare 는 주로 .d.ts 확장자를 가진 파일 내에서 사용되는데, 이 파일들은 TS 가 JS 코드의 타입 정보를 이해하는 데 도움을 주며, NPM 패키지 등에서 타입 정의를 제공할 때 핵심적인 역할을 한다.

전역 변수/함수 타입 정의
브라우저 환경의 객체에 새로운 속성이나 함수를 추가할 때, TS 컴파일러가 이를 인식하도록 declare global 블록을 사용할 수 있다.

declare global {
  interface Window {
    myGlobalFunction: () => void;
  }
}

// 이제 window.myGlobalFunction 사용 가능
window.myGlobalFunction = () => { console.log('Hello'); };

 

외부 모듈 선언
타입 정의 파일이 없는 특정 모듈을 import 하려고 할 때, 컴파일러 오류를 방지하기 위해 해당 모듈의 존재를 선언할 수 있다.

declare module "some-external-lib";