에러메세지

Property 'X' does not exist on type 'Window & typeof globalThis'.

위와 같은 에러 해결 방법

해결

Window 인터페이스 수정하기

lib.dom.d.ts 라는 파일에 Window 인터페이스가 정의되어 있다.
그걸 변경해 주면 속성을 인식할 수 있다.

글로벌로 설정하기

Window의 글로벌 정의를 변경하기!

컴포넌트에서 수정하기

// .ts or .tsx file
declare global {
	interface Window {
    	X: number
    }
}

declare global은 타입스크립트한테
여기 안에 있는 거 글로벌로 추가하겠음 이라는 뜻

그리고 타입스크립트에서는 interface가 같은 이름일 때
같은 스코프를 갖는다면 병합이 자동으로 됨 (type은 안됨)

ts 파일에서 수정하기

interface Window {
	X: number
}

만약 어디에 추가해야 할 지 모르겠다면 이 방법을 사용함

왜냐하면 .d.ts 파일에 있는 건
무조건 global 스코프를 가지게 됨

그래서 여기서는 declare global을 안 쓰는 것

한 컴포넌트(모듈)에서만 쓰려면?

// anyfilename.d.ts
// 예를 들면 여기서는 window.d.ts
declare const window: {
	X: number
} & Window

이유

Window 인터페이스는 타입스크립의 글로벌 스코프임
브라우저에서 어떤 메서드가 가능한지를 설명하는 lib.dom.d.ts에 있는 DOM 타입의 한 종류임

그래서 원래 윈도우에 없는데
우리가 써드 파티 스크립트를 사용하느라고
윈도우에 뭔가 추가하면 에러가 나는 거임

그러면 윈도우는 얘의 타입을 몰라서 에러를 뱉게 됨