에러 발생

회사 프로젝트를 JS -> TS로 리펙토링 하는 중에 발생된 에러이다.

import React, { useEffect, useContext } from 'react';
import FramerMotionAnimate from '../../util/FramerMotionAnimate.json'; // 에러 발생

const AuthorUl = ({
  data,
  onClick = () => {},
  size = 'small',
  mode,
}) => {

  return (
    <ul>
    
    </ul>
  );
};

export default AuthorUl;

에러 원인

	Cannot find module '../../util/FramerMotionAnimate.json'. Consider using '--resolveJsonModule' to import module with '.json' extension.

에러 해결

tsconfig.json 파일로 들어가서 resolveJsonModule를 추가하면 된다.

    "compilerOptions": {
        "resolveJsonModule": true, // 추가
            "@/*": [
                "src/*"
            ]
        }
    }