i18n Routing - Question
Hello I would like to add i18n support to my TanStack Start app
I was hoping to support
website.com/my/path (english)
website.com/en-us/my/path (english)
website.com/es-ES/my/path (spanish)
Is this possible? If so, is it recommended?
I was thinking to try this via Virtual Routing + File Routing, but im a bit stuck
Thanks!
7 Replies
rising-crimson•7mo ago
Here's a demo repo showing you how to do that with paraglide/inlang: https://github.com/IgorSzymanski/tanstack-start-paraglide
GitHub
GitHub - IgorSzymanski/tanstack-start-paraglide
Contribute to IgorSzymanski/tanstack-start-paraglide development by creating an account on GitHub.
yappiest-sapphire•6mo ago
By the way, the repo has been updated to work after
devinxi. 🙂deep-jade•6mo ago
how does the paraglide middleware handle optional path aprameters? i tought this was a missing feature from tsr
wise-white•4mo ago
Just to share my experience, after adding paraglide my server crash with this error
I have opened a PR as a minimal reproducer for this error @Igor https://github.com/IgorSzymanski/tanstack-start-paraglide/pull/11
GitHub
bug: unable to use react-query by melkir · Pull Request #11 · Igo...
This is a minimal example that leads the vite runtime to crash
Error reading routerStream: TypeError [ERR_INVALID_STATE]: Invalid state: ReadableStream is locked
magic-amber•4mo ago
I think you can just use optional params like
/{-$locale}/my/pathwise-white•4mo ago
Thanks for the "optional params" info. I'm actually aiming for a multi-strategy localization: URL path > cookie > browser language.
The main hurdle is hydration errors when the server-side language conflicts with the client's browser preference.
Any advice on handling this hierarchy smoothly?
magic-amber•4mo ago
idk how you do this w/ Start specifically, but I've done this before by reading a cookie on the server to render the correct language (or 302 redirect to the correct URL). And if the user hasn't expressed a preference, fallback to the
accept-language header instead of the cookie