[ERROR 해결] 타입 올바르게 썼는데 type error 오류가 날 때 해결법

# 문제상황

외부 라이브러리를 가져다 쓰는 상황에서

예시 코드를 그대로 가져다 복사 붙여넣기 했는데도 불구하고 타입에러가 났다.

 

 

 

 

에러문을 읽어보면 요지는 아래와 같다.

		'legend.position'의 형식은 해당 형식 간에 호환되지 않습니다.
        'string' 형식은 '"right" | "top" | "bottom" | "left" | undefined' 형식에 할당할 수 없습니다.

내 코드의 legend.position의 "right"이라는 'String'형식의 값이  '"right" | "top" | "bottom" | "left" | undefined'''이라는 값에 안 맞는 다는 것이었는데

내가 사용한 라이브러리의 공식 홈페이지에 가서 정의타입을 찾아보니 position의 타입은 String으로 코드에 쓰인 string값과 동일하다는 것이었다..

 

 

결국, 지정된 타입에 맞춰 나는  string형식의 값인 'right'으로 올바르게 코드가 작성되어있는 상황이었다.

그렇다면, 올바르게 타입을 작성했는데도 오류가 나는 이 상황은 대체 어떻게 해결해야하는것일까?

 

 

 

# 원인 후보

이런 상황의 원인은 chatGPT에 물어보니 아래의 경우들에 해당할 수 있다고 한다

1. 타입 정의가 충돌하는 경우: 라이브러리 버전 충돌 등으로 타입 정의 파일이 충돌할 수 있습니다. 최신 버전의 타입 정의를 사용하거나, 타입 정의 파일을 다시 설치하거나 업데이트해 보세요.
2. 라이브러리 버그: 가끔 라이브러리 버그로 인해 이상한 오류가 발생할 수 있습니다. GitHub 등에서 해당 라이브러리의 이슈를 찾아보고, 관련된 오류가 이미 보고되었는지 확인해 보세요.
3. 다른 부분에서의 영향: 오류가 발생하는 코드 블록 외부에 다른 영향을 미치는 요인이 있는지 확인해 보세요. 코드 전체를 검토하면서 legend.position을 다른 곳에서 어떻게 사용하는지, 다른 설정과의 조합에서 어떤 문제가 발생하는지 확인해 보세요.
4. 캐싱 문제: 때로는 빌드 도구나 캐싱으로 인해 코드 변경 사항이 적용되지 않을 수 있습니다. 이 경우에는 캐시를 지우고 다시 빌드해 보는 것이 도움이 될 수 있습니다.
5. 타입 강제 변환: 경우에 따라 타입 강제 변환을 통해 문제를 해결할 수 있을 때가 있습니다. 다음과 같이 강제 변환을 시도해 볼 수 있습니다:
   legend: { position: "right" as "right", },

chatGPT가 제시해준 5번 방법대로 as연산자를 사용해 강제 변환을 시켜주니

 

에러 없이 정상 작동한다! 

 

 

 

# 결론

라이브러리가 최신 버전이 아니라 버전 충돌때문에 타입 에러가 발생하는 것일 수도 있으니

as연산자를 사용해 강제타입변환을 해봐라!