diff --git a/docs/content/3.options/2.routing.md b/docs/content/3.options/2.routing.md index a34740dbb..13a4d8ed9 100644 --- a/docs/content/3.options/2.routing.md +++ b/docs/content/3.options/2.routing.md @@ -13,6 +13,8 @@ The fallback base URL to use as a prefix for alternate URLs in `hreflang` tags. Can also be a function (will be passed a Nuxt Context as a parameter) that returns a string. Useful to make base URL dynamic based on request headers. +This property can also be set using [`runtimeConfig`](./runtime-config). + ::alert{type="info"} It's especially important to set this option when using SEO features, in which case it's required that generated SEO tags use fully-qualified URLs. diff --git a/docs/content/3.options/7.runtime-config.md b/docs/content/3.options/7.runtime-config.md new file mode 100644 index 000000000..644d7a05b --- /dev/null +++ b/docs/content/3.options/7.runtime-config.md @@ -0,0 +1,47 @@ +# Runtime config + +Some options can be set via the `runtimeConfig`, setting options this way makes it possible to override these after building using environment variables. + +--- + +## Usage + +If you want to use environment variables to change [supported options](#supported-options), you will have to set these in `runtimeConfig.public.i18n`. + +The module configuration takes precedence, options set through `runtimeConfig` will only be used if they are unset. + +Setting `baseUrl` through `runtimeConfig` would look like this: + +```ts {}[nuxt.config.ts] +export default defineNuxtConfig({ + runtimeConfig: { + public: { + i18n: { + baseUrl: 'https://example.com', + } + } + }, + modules: [ + '@nuxtjs/i18n' + ], + i18n: { + // Leave options unset that you want to set using `runtimeConfig` + // baseUrl: 'https://example.com', + } +}) +``` + +With this configuration you will be able to override the `baseUrl` option by setting the `NUXT_PUBLIC_I18N_BASE_URL` environment variable. You can read more about how this works in the [Nuxt documentation](https://nuxt.com/docs/guide/going-further/runtime-config#environment-variables). + +## Supported options + +These options can be set using `runtimeConfig`: +* [`baseUrl`](./routing#baseUrl) + +::alert{type=warning} +Only [serializable values are supported](https://nuxt.com/docs/guide/going-further/runtime-config#serialization) in `runtimeConfig`, options set this way may not support all available types (such as functions) as would normally be possible using the default configuration. +:: + +::alert{type=info} +If you would like other options to be supported, open an issue describing your use case, or open a PR adding to add support yourself! +:: diff --git a/specs/seo/baseUrl_runtimeConfig.spec.ts b/specs/seo/baseUrl_runtimeConfig.spec.ts new file mode 100644 index 000000000..9bff59cd7 --- /dev/null +++ b/specs/seo/baseUrl_runtimeConfig.spec.ts @@ -0,0 +1,35 @@ +import { expect, test } from 'vitest' +import { fileURLToPath } from 'node:url' +import { setup, $fetch } from '@nuxt/test-utils' +import { getDom, getDataFromDom, assertLocaleHeadWithDom } from '../helper' + +const configDomain = 'https://runtime-config-domain.com' +await setup({ + rootDir: fileURLToPath(new URL(`../fixtures/basic`, import.meta.url)), + browser: true, + // overrides + nuxtConfig: { + runtimeConfig: { + public: { + i18n: { + baseUrl: configDomain + } + } + }, + i18n: { + // debug: true, + defaultLocale: 'en', + baseUrl: '' + } + } +}) + +test('render seo tags with baseUrl', async () => { + const html = await $fetch('/?noncanonical') + const dom = getDom(html) + await assertLocaleHeadWithDom(dom, '#home-use-locale-head') + + const links = getDataFromDom(dom, '#home-use-locale-head').link + const i18nCan = links.find(x => x.id === 'i18n-can') + expect(i18nCan.href).toContain(configDomain) +}) diff --git a/src/runtime/utils.ts b/src/runtime/utils.ts index 37861c922..780f7e045 100644 --- a/src/runtime/utils.ts +++ b/src/runtime/utils.ts @@ -485,7 +485,9 @@ export function extendBaseUrl( ): BaseUrlResolveHandler { return (context: Context): string => { if (isFunction(baseUrl)) { - return baseUrl(context) + const baseUrlResult = baseUrl(context) + __DEBUG__ && console.log('baseUrl: using localeLoader function -', baseUrlResult) + return baseUrlResult } const { differentDomains, localeCodeLoader, normalizedLocales } = options @@ -493,10 +495,17 @@ export function extendBaseUrl( if (differentDomains && localeCode) { const domain = getDomainFromLocale(localeCode, normalizedLocales, options.nuxt) if (domain) { + __DEBUG__ && console.log('baseUrl: using differentDomains -', domain) return domain } } + const config = context.$config?.public?.i18n + if (config?.baseUrl) { + __DEBUG__ && console.log('baseUrl: using runtimeConfig -', config.baseUrl) + return config.baseUrl + } + return baseUrl } }