JavaScript 프로젝트를 TypeScript로 변경하면서 발생한 에러

일단 기본적으로 타입을 추가해줘야 한다!

이건 당연하다!

 

1. import 할 때 이미지 파일 관련 에러 

Cannot find modules '../..' or its corresponding type declarations. ts(2307)

라고 수많은 에러가 발생했다.

 그럼 해결해 보자!

 

src파일 아래에 images.d.ts파일을 생성한다. (index.d.ts로 파일명을 하면 index.ts파일로 인식하기 때문에 다른 이름으로 해주기)

필요한 확장자를 아래와 같이 추가해준다.

declare module "*.png";
declare module "*.jpg";

tsconfig.json에 compilerOptions:{} 안에 추가해준다.

 "typeRoots": ["./src/@types"]

저장을 하면 오류가 사라진다.

 

2. useRef 관련 에러

The left-hand side of an assignment expression may not be an optional property access. ts(2779)

 

옵셔널 체이닝은  주어진 함수가 존재하지 않는다면 undefinded를 리턴하기 때문에 ""를 넣어줄 수 없다.

 

여기서는 옵셔널 체이닝 방식이 아니라

아래와 같이 titleRef.current과 contentRef.current이 null이 아닌지 확인해줘야 한다.

   if (titleRef.current !== null && contentRef.current != null) {
      titleRef.current.value = "";
      contentRef.current.value = "";
    }