[TypeScript Issue] JSON file 로컬에서 import 하기

young_pallete·2021년 6월 30일
1
post-custom-banner

프로젝트 중, 다음과 같은 메시지가 발생하였다.

"'./datas/program-data.json' 모듈을 찾을 수 없습니다. 'moduleResolution' 옵션을 'node'로 설정하거나 'paths' 옵션에 별칭을 추가하려고 하셨습니까?"

간단하다. json파일을 모듈로 인식을 하지 못하는 것이다.

해결 방법은 다음과 같았다.
json.d.ts파일을 하나 생성하고, 다음 코드를 작성한다.

declare module "*.json" {
    const value: any;
    export default value;
}

필자의 경우, 이러한 방식으로 문제를 해결하다 난관에 봉착했다.
바로 json의 키를 인식하지 못하는 문제였는데,

import * as [별칭] from [모듈 경로];

이렇게 하는 경우, 별칭JSON 타입이 아니라 parse 메서드를 할 수 없기에 발생한 이슈였다.

해결 방법은 그냥 다음과 같이 별칭이 아니라 새로 객체명을 써주면 됐다.
모듈 역시 엄연히 하나의 객체이기 때문에, 객체명을 입력해줌으로써 json을 참조하는 것이다!

import [객체명] from [모듈 경로];
profile
People are scared of falling to the bottom but born from there. What they've lost is nth. 😉
post-custom-banner

0개의 댓글