i18next: Add documentation for the new breaking change in TS
Documentation issue
Yesterday, there was a breaking change where now the t
function is not returning a string anymore. It is returning a DefaultTFuncReturn
. This is breaking a lot of things in my React app because I used to say that t
would just return a string. In fact, it still does so when you use variables inside the string like this i18next.t('{{var}} something', { var })
.
Motivation
I have researched and there is no documentation on why this change was made or how it would impact existing projects.
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 14
- Comments: 17 (6 by maintainers)
What I am finding here that makes all the problems go away is to: 1.) Update all packages for i18next and react-i18next to the latest. 2.) My current react-i18next.d.ts is exactly what follows this example: https://react.i18next.com/latest/typescript. 3.) Just change in your react-i18next.d.ts file:
Well for example, I am using Material UI, and some props expect things to be
string | undefined
. If I pass a translated string to it, it will complain because the return type isDefaultTFuncReturn
. And I don’t know if casting the translation result to astring
is the cleanest solution…In general, if you are using any 3rd party library and their props expect strings, this will be a problem.
@httpete and @DavidArmendariz - in the future, the best way to convey your case would be to PR a minimal breaking test - e.g. check out https://github.com/i18next/i18next/blob/master/test/typescript/t.test.ts#L39
If it is react related, check out something like https://github.com/i18next/react-i18next/blob/master/test/typescript/useTranslation.test.tsx and PR one there.
For our codebase update (which included mui 4) on a large codebase, I had only three or so
TFunction
changes (cast related), and ironically enough it exposed several (10-15) muititle
attributes that wereNonNullable
but were never reported as problems (and they were indeed problems)…so it seems like an improvement overall, but I agree the default value will make less friction (#1853).By PR’ing minimal breaking tests, it allows us to not only fix these now, but make sure we don’t have regressions later. Thanks for taking time to research the issue and trying out this major release.
The PR that I just opened should fix the problem, but I really recommend to follow the steps here https://www.i18next.com/overview/typescript, to get the best of
i18next
andreact-i18next
.JS api is still the same… only the TS interface did receive a major rewrite because of many “wishes” by the community… nevertheless it’s a semver major bump.
Please be patient and give the opportunity to @pedrodurek and @rosskevin to explain this TS change.