Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: default language multi domain locales #3250

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions docs/content/docs/2.guide/10.multi-domain-locales.md
Original file line number Diff line number Diff line change
Expand Up @@ -98,8 +98,7 @@ With the above config, a build would have to be run for staging and production w

## Using different domains for only some of the languages

If one or more of the domains need to host multiple languages, the default language of each domain needs to have `domainDefault: true`{lang="ts"} so there is a per domain fallback locale.
The option `differentDomains` still need to be set to `true`{lang="ts"} though.
If multiple domains share the same default language, you can specify them all using `defaultForDomains`, which supports multiple domains.

```js {}[nuxt.config.js]
const i18nDomains = ['mydomain.com', 'en.mydomain.com', 'es.mydomain.com', 'fr.mydomain.com', 'http://pl.mydomain.com', 'https://ua.mydomain.com']
Expand Down
18 changes: 18 additions & 0 deletions specs/fixtures/multi_domains_locales/i18n.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,12 @@ export default {
blog: {
article: "Cette page d'article de blog"
}
},
parent: {
text: 'Test de la voie parentale',
child: {
text: 'Test de parcours pour enfants'
}
}
},
en: {
Expand All @@ -26,6 +32,12 @@ export default {
blog: {
article: 'This is blog article page'
}
},
parent: {
text: 'Parent route test',
child: {
text: 'Child route test'
}
}
},
no: {
Expand All @@ -39,6 +51,12 @@ export default {
blog: {
article: 'Dette er bloggartikkelsiden'
}
},
parent: {
text: 'Forældrerutetest',
child: {
text: 'BΓΈrns rute test'
}
}
}
},
Expand Down
8 changes: 8 additions & 0 deletions specs/fixtures/multi_domains_locales/pages/parent.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<script setup lang="ts">
const { t } = useI18n()
</script>

<template>
<p id="parent-text">{{ t('parent.text') }}</p>
<NuxtPage />
</template>
7 changes: 7 additions & 0 deletions specs/fixtures/multi_domains_locales/pages/parent/child.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<script setup lang="ts">
const { t } = useI18n()
</script>

<template>
<p id="child-text">{{ t('parent.child.text') }}</p>
</template>
Original file line number Diff line number Diff line change
Expand Up @@ -81,3 +81,21 @@ test('detection locale with x-forwarded-host on server', async () => {
expect(dom.querySelector('#lang-switcher-current-locale code').textContent).toEqual('fr')
expect(dom.querySelector('#home-header').textContent).toEqual('Accueil')
})

describe('detection locale with child routes', () => {
test.each([
['/parent/child', 'nuxt-app.localhost', 'Parent route test', 'Child route test'],
['/no/parent/child', 'nuxt-app.localhost', 'Forældrerutetest', 'Børns rute test'],
['/fr/parent/child', 'nuxt-app.localhost', 'Test de la voie parentale', 'Test de parcours pour enfants']
])('%s host', async (path, host, parentText, childText) => {
const res = await undiciRequest(path, {
headers: {
Host: host
}
})
const dom = getDom(await res.body.text())

expect(dom.querySelector('#parent-text').textContent).toEqual(parentText)
expect(dom.querySelector('#child-text').textContent).toEqual(childText)
})
})
2 changes: 1 addition & 1 deletion src/routing.ts
Original file line number Diff line number Diff line change
Expand Up @@ -175,7 +175,7 @@ export function localizeRoutes(routes: NuxtPage[], options: LocalizeRoutesParams
) {
localizedRoutes.push({
...localized,
name: `${localized.name}___default`
name: `${localized.name}___${options.defaultLocaleRouteNameSuffix}`
})
}

Expand Down
17 changes: 9 additions & 8 deletions src/runtime/internal.ts
Original file line number Diff line number Diff line change
Expand Up @@ -397,21 +397,22 @@ export function setupMultiDomainLocales(nuxtContext: NuxtApp, defaultLocaleDomai
const router = useRouter()
const defaultRouteSuffix = [routesNameSeparator, defaultLocaleRouteNameSuffix].join('')

// remove or rename default routes if not applicable for domain
// Adjust routes to match the domain's locale and structure
for (const route of router.getRoutes()) {
const routeName = getRouteName(route.name)

if (!routeName.includes(defaultRouteSuffix)) continue
if (routeName.endsWith(defaultRouteSuffix)) {
router.removeRoute(routeName)
continue
}

const routeNameLocale = routeName.split(routesNameSeparator)[1]
if (routeNameLocale === defaultLocaleDomain) {
route.name = routeName.replace(defaultRouteSuffix, '')
continue
router.addRoute({
...route,
path: route.path === `/${routeNameLocale}` ? '/' : route.path.replace(`/${routeNameLocale}`, '')
})
}

// use `route.name` directly as `routeName` stringifies `Symbol`
// @ts-expect-error type mismatch
router.removeRoute(route.name)
}
}

Expand Down
Loading