react-i18next and typescript 4.1

Question

I'm having trouble figuring out how to use react-i18next with typescript 4.1.

According to the docs, I should be able to do:

const { t } = useTranslation();
return <h1>{t('title')}</h1>

However, that call to t errors:

No overload matches this call: Argument of type 'string' is not assignable to parameter of type 'never'.

What does work is using either:

useTranslation<string>()

or

useTranslation('translation')

Both of these seem unnecessary qualifications.

This seems to only be the case with typescript 4, as if I downgrade to typescript 3 the error goes away.

Is there a way to use the shorter useTranslation() in typescript 4?

did you see this ?? : stackoverflow.com/questions/58277973/… — Robert
– Robert, Commented Dec 7, 2020 at 17:11
This appears to be a bug in the latest release of react-i18next. See #1213 (typescript) Template literals no longer work post 11.8.0 — olav
– olav, Commented Dec 8, 2020 at 12:58

Vít Zadina · Accepted Answer · 2021-11-26 09:05:28Z

1

I know this is probably late, but there is very good boilerPlate for starting react typescript i18next app. Check this github - https://github.com/Lemoncode/i18next-example-typescript

answered Nov 26, 2021 at 9:05

Vít Zadina

5723 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1