TypeScript Image Import

Image Import

타입스크립트에서 이미지를 import하려고 하는데 에러가 발생한다.

그래서 구글링을 해봤더니 타입이 정의되어 있지 않아서 그렇다고 한다.

//index.d.ts
declare module "*.png";

그래서 index.d.ts 파일을 만들어 모든 png파일의 타입을 정해주었다. 그런데도 안되네?

다시 찾아보니 index.d.ts 파일은 index.ts 파일이 생성했다고 TypeScript가 추측해서 무시된다고 한다.

// tsconfig.json
"typeRoots": ["src/types"]

// src/types/images.d.ts
declare module "*.png";

그래서 tsconfig.json에서 typeRoots 옵션을 통해 경로를 정해주고 src/types 경로에 index는 무시된다고 하니 다른 이름으로 images.d.ts를 만들어주고 이미지 파일의 타입을 선언해주었다.

이제 이미지를 import해보면 정상적으로 잘 되는 것을 확인할 수 있다.