타입스크립트 환경이라면 JSON 타입도 명확하게 지정해줘야 에러가 발생하지 않는다.
🚫 '{}' 형식의 인수는 'string' 형식의 매개 변수에 할당될 수 없습니다.
위와 같은 에러가 발생했을 때 해결 방법에 대해 알아보자.
우선 타입스크립트에서 JSON 파일을 import 해서 사용하려면 몇 가지 세팅이 필요하다. 아래 코드를 추가해두자.
(tsconfig.json)
{
"compilerOptions": {
"esModuleInterop": true,
"moduleResolution": "node",
"resolveJsonModule": true
}
}
- esModuleInterop: default export가 없는 모듈의 경우 default export가 있는 모듈인 것처럼 default import로 불러와 사용할 수 있도록 컴파일을 한다.
- moduleResolution: 모듈 해석 방식을 결정한다.
- resolveJsonModule: true면 확장자가 .json인 모듈의 import를 허용한다.
JSON 타입 에러를 해결하는 방법은 가져온 JSON의 타입을 문자라고 명확하게 표시해주는 것이다. (JSON은 문자열)
방법은 두 가지가 있다.
let obj = JSON.parse(JSON.stringify(cityData));
let obj = JSON.parse(cityData as string);