react-i18next라이브러리 withTranslation 사용법

React
1

안녕하세요. react-i18next라이브러리를 사용하여 영어와 한국어 지원을 진행하고 있습니다.

현재 특정 opensource프로젝트를 가져와서 i18n을 적용해보고 있는데 해당 opensource 프로젝트가 좀 오래된 버전이어서 class형 component로 짜여져 있는게 많고 2버전 대에 typescript를 사용하고 있어 react-i18next를 적용하는데 난항을 겪고 있습니다.

제가 질문드리고 싶은 것은 크게 2가지인데요.

  1. withTranslation()을 적용하려고 하는데 잘 적용이 안됩니다.
    => 제가 이해 하기로 react-i18next를 적용하기 위해서는 적용하려고 하는 컴포넌트에 withTranslation 혹은 useTranslation을 사용하여 해당 컴포넌트에 t함수를 사용하여 적용하는 것으로 알고 있습니다.
    현재 함수형 컴포넌트에는 useTranslation을 적용하여 문제가 없는데 class형 컴포넌트에는 withTranslation을 적용해야하는데 생각 처럼 잘되지 않습니다. 현재 export default withTranslation()(‘컴포넌트’)일 때는 잘되는데 export default를 제외하고 선언할 경우에는 동작 하지 않습니다.

  2. 해당 컴포넌트가 typescript로 props가 제한되어있는 경우
    => (사실 제가 타입스크립트에는 문외한이라 제 뇌피셜이 첨가된 질문입니다.) 컴포넌트에 withTranslation을 적용 할 경우 props값으로 t()가 들어가서 i18n을 사용할 수 있게 됩니다. 근데 해당 컴포넌트가 typescript로 props의 들어갈 값이 이미 명명 되어있을 경우에는 withTranslation을 선언해도 props로 t()가 들어가지 않는 것 같습니다.

위 두가지가 질문입니다. 지금 다양한 방법으로 해결책을 찾고 있는데 원하는 결과물이 나올지 확신이 안서서 고수님들의 의견을 묻고자 글을 오리네요. 혹시 해결책이나 시도 해볼만한 추측이 있다면 말씀해주시면 감사하겠습니다.