error when using astro-i18next Trans component

[rxtsel]

I get errors when I am in development mode. If I import a utility component, in this case the Trans component, I immediately crash the server. I get the following error in the console:

C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro-i18next@1.0.0-beta.21_astro@3.1.3/node_modules/astro-i18next/src/utils.ts:59
    interpolatedString = interpolatedString.replaceAll(
                                            ^

TypeError: Cannot read properties of undefined (reading 'replaceAll')
    at Module.interpolate (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro-i18next@1.0.0-beta.21_astro@3.1.3/node_modules/astro-i18next/src/utils.ts:59:45)
    at default (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro-i18next@1.0.0-beta.21_astro@3.1.3/node_modules/astro-i18next/src/components/Trans.astro:20:253)
    at Object.render (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/slot.js:29:92)
    at Module.renderSlotToString (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/slot.js:51:24)
    at renderFragmentComponent (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/component.js:311:49)
    at Module.renderComponent (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/component.js:343:18)
    at eval (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro-i18next@1.0.0-beta.21_astro@3.1.3/node_modules/astro-i18next/src/components/Trans.astro:20:63)
    at async AstroComponentInstance.render (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/astro/instance.js:37:7)
    at async Object.render (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/component.js:334:7)
    at async Module.renderChild (C:/Users/rxtsel/Desktop/qantto/node_modules/.pnpm/astro@3.1.3/node_modules/astro/dist/runtime/server/render/any.js:36:5)

Node.js v20.7.0
 ELIFECYCLE  Command failed with exit code 1.

To Reproduce

Steps to reproduce the behavior:

1. pnpm run dev

Screenshots

• astro-i18next version: [1.0.0-beta.21]
• astro version: [3.1.3]
• OS: Windows 11
• Browser: [Brave]

Code here:

https://github.com/abouthernan/qantto/blob/01118012171309043c95951074f573b32d9a5066/src/components/Hero.astro#L65C10-L65C16

[rxtsel]

This only happens in development mode. The local server is shut down when running pnpm run dev. But when uploading to prod it works perfectly

[timwehrle]

This also happens to LanguageSelector and HeadHrefLang components.

[rxtsel]

This also happens to LanguageSelector and HeadHrefLang components.

That's right, it happens with utility components

[timwehrle]

This also happens to LanguageSelector and HeadHrefLang components.

That's right, it happens with utility components

Just try an older version. Downgrading worked.

[V-Mokhun]

Are there any solutions to this problem? I'm facing it and am looking for a fix

[timwehrle]

@V-Mokhun Downgrade the version of the i18n lib.

[V-Mokhun]

@timwehrle to which one exactly? I now have: "astro-i18next": "^1.0.0-beta.21", "react-i18next": "^13.5.0",

[timwehrle]

@V-Mokhun I used "astro-i18next": "^1.0.0-beta.21" in my astro app. I don't know maybe there are some other conflicts with react-i18next? I only used astro-i18next and the "i18next": "^22.5.1".

[V-Mokhun]

@timwehrle Thanks, after the whole day I fixed it somehow ;) For anyone else wondering, I downgraded react-i18next to 12.0.0 and i18next to 22.5.1