Nuxt app with three locales, how does slot content follow the active locale?
Hi everyone! We run a travel site on Nuxt with pt/es/en routes handled by nuxt i18n. Adding Croct for hero personalization and I am trying to understand the localization story. Does the SDK pick up the locale from the route automatically, or do I pass it on each fetch? And where do the translations live, in our code or in the dashboard? Our marketing team manages campaign copy per country so this part matters a lot to us
1 answer
You pass the locale explicitly, using the active locale from nuxt i18n. Two ways to wire it:
- Per fetch, with the preferredLocale option, using whatever locale the i18n module reports for the current route.
- Globally, by setting defaultPreferredLocale in the plug options, so every fetch inherits it without repeating the option.
Per fetch is usually the better fit with route-based locales, since the value changes as users navigate between /pt, /es, and /en.
On where translations live: per-locale default content is managed by the localization add-on, so your marketing team edits the pt, es, and en versions of each slot in the dashboard. No extra routes or content files in code, and campaign copy changes per country do not need a deploy.
One more thing worth knowing for a travel site where LCP matters: the Nuxt SDK resolves content during SSR, so the localized, personalized HTML is what the browser receives on first paint. Background on that in the Vue and Nuxt SDK announcement.