diff --git a/docs/content/2.guide/16.migrating.md b/docs/content/2.guide/16.migrating.md index 696e2f2a2..5d9b72466 100644 --- a/docs/content/2.guide/16.migrating.md +++ b/docs/content/2.guide/16.migrating.md @@ -16,7 +16,7 @@ You can continue defining `vueI18n` options in `i18n.config`. Refer to the [Vue ### Change the route key rules in `pages` option -The key of route set in the `pages` option has been changed to be file-based relative to the `pages/` directory in Nuxt, and **excluding the leading `/`**. +The key of route set in the `pages` option has been changed to be file-based relative to the `pages/` directory in Nuxt, and **excluding the leading `/`**. The reason is that it is more intuitive to match Nuxt file-based routing. @@ -83,6 +83,38 @@ Deprecated for the same reason as the `localeLocation()` Option API. Use `localeHead()` instead for the Options API style. +### `baseUrl` component option + +You can use `site.url` instead of `i18n.baseUrl`. + +::alert{type="info"} +The `site` configuration option stems from [Nuxt SEO's `site-config` module](https://nuxtseo.com/site-config), which `nuxt-i18n` makes use of now. +:: + +Nuxt2: +```vue {}[nuxt.config.js] + +``` + +Nuxt3: +```vue {}[nuxt.config.js] + +``` + ### Deprecated `nuxtI18n` component option Replaced by the `defineI18nRoute()` compiler macro as it can be optimized with bundler. @@ -122,7 +154,7 @@ Use the `customRoutes` option. because the option name `parsePages` is not intui modules: [ '@nuxtjs/i18n' ], - + i18n: { // ... - parsePages: false, @@ -141,7 +173,7 @@ Use `dynamicRouteParams` option. Because Vuex is no longer required by the Nuxt modules: [ '@nuxtjs/i18n' ], - + i18n: { // ... - vuex: true, diff --git a/docs/content/2.guide/7.seo.md b/docs/content/2.guide/7.seo.md index 84df68fe7..26f9f874c 100644 --- a/docs/content/2.guide/7.seo.md +++ b/docs/content/2.guide/7.seo.md @@ -24,7 +24,7 @@ To leverage the SEO benefits, you must configure the `locales` option as an arra ```ts {}[nuxt.config.ts] export default defineNuxtConfig({ // ... - + i18n: { locales: [ { @@ -41,26 +41,36 @@ export default defineNuxtConfig({ } ] }, - + // ... }) ``` -You must also set the `baseUrl` option to your production domain in order to make alternate URLs fully-qualified: +You must also set the `baseUrl` or `site.url` option to your production domain in order to make alternate URLs fully-qualified: ```ts {}[nuxt.config.ts] export default defineNuxtConfig({ // ... + site: { + url: 'https://my-nuxt-app.com' + }, + + // or + i18n: { baseUrl: 'https://my-nuxt-app.com' }, - + // ... }) ``` -(Note that `baseUrl` can also be set to a function. Check [`baseUrl` documentation](/options/routing#baseurl).) +::alert{type="info"} +The `site` configuration option stems from [Nuxt SEO's `site-config` module](https://nuxtseo.com/site-config). +:: + +::alert{type="info"} Note that `i18n.baseUrl` can also be set as a function as specified in [`i18n.baseUrl`'s documentation](/options/routing#baseurl). ## Setup diff --git a/docs/content/3.options/2.routing.md b/docs/content/3.options/2.routing.md index 8c6b66afd..f33f02fc8 100644 --- a/docs/content/3.options/2.routing.md +++ b/docs/content/3.options/2.routing.md @@ -6,6 +6,10 @@ Routing and Strategies options. ## `baseUrl` +::alert{type="info"} +You can use [Nuxt SEO's `site.url`](https://nuxtseo.com/site-config) instead of `i18n.baseUrl`. +:: + - type: `string` or `function` - default: `''` @@ -132,7 +136,7 @@ Set to a path to which you want to redirect users accessing the root URL (`/`). - type: `boolean` - default: `false` -Whether to localize dynamic route parameters. +Whether to localize dynamic route parameters. If `true`, you can set the dynamic route parameter to `nuxtI18n` field of `definePageMeta` for each locale: diff --git a/docs/content/3.options/9.runtime-config.md b/docs/content/3.options/9.runtime-config.md index d3f8dce5a..9e8116cef 100644 --- a/docs/content/3.options/9.runtime-config.md +++ b/docs/content/3.options/9.runtime-config.md @@ -6,7 +6,7 @@ Some options can be set via the `runtimeConfig`, setting options this way makes ## Usage -If you want to use environment variables to change [supported options](#supported-options), you will have to set these in `runtimeConfig.public.i18n`. +If you want to use environment variables to change [supported options](#supported-options), you will have to set these in `runtimeConfig.public.i18n`. ```ts {}[nuxt.config.ts] export default defineNuxtConfig({ @@ -15,12 +15,12 @@ export default defineNuxtConfig({ ], i18n: { // Leave options unset that you want to set using `runtimeConfig` - // baseUrl: 'https://example.com', + // defaultLocale: 'en', }, runtimeConfig: { public: { i18n: { - baseUrl: 'https://example.com', + defaultLocale: 'en', locales: {}, // other options ... } @@ -47,13 +47,17 @@ The module configuration takes precedence, options set through `runtimeConfig` w These options can be set using `runtimeConfig`: ### `baseUrl` -* key: `NUXT_PUBLIC_I18N_BASE_URL` -This runtime config option is the same as the [`baseUrl`](./routing#baseUrl) module option. +::alert{type="info"} +You can use [Nuxt SEO's `site.url`](https://nuxtseo.com/site-config) instead of `i18n.baseUrl`. +:: + +* key: `NUXT_PUBLIC_I18N_BASE_URL` +This runtime config option is the same as the [`baseUrl`](./routing#baseUrl) module option. ::alert{type=warning} -Note that the `baseUrl` module option allows you to set the function, but the runtime config does not due to limitations. +Nuxt's runtime config does not allow values to be specified as functions, so you must use the `baseUrl` module option if you need to set the value using a function. :: ### `locales` diff --git a/package.json b/package.json index 3c2585418..8519ee7a2 100644 --- a/package.json +++ b/package.json @@ -88,6 +88,8 @@ "knitwork": "^1.0.0", "magic-string": "^0.30.4", "mlly": "^1.4.2", + "nuxt-site-config": "^1.4.0", + "nuxt-site-config-kit": "^1.4.0", "pathe": "^1.1.1", "ufo": "^1.3.1", "unplugin": "^1.5.0", diff --git a/playground/layer-module/nuxt.config.ts b/playground/layer-module/nuxt.config.ts index 828fdbfba..f95370ab4 100644 --- a/playground/layer-module/nuxt.config.ts +++ b/playground/layer-module/nuxt.config.ts @@ -6,7 +6,6 @@ export default defineNuxtConfig({ i18n: { langDir: 'locales', lazy: true, - baseUrl: 'http://localhost:3000', locales: [ { code: 'en', @@ -30,5 +29,8 @@ export default defineNuxtConfig({ name: 'Nederlands' } ] + }, + site: { + url: 'http://localhost:3000' } }) diff --git a/playground/layers/i18n-layer/nuxt.config.ts b/playground/layers/i18n-layer/nuxt.config.ts index 73723bb9a..a4f194e26 100644 --- a/playground/layers/i18n-layer/nuxt.config.ts +++ b/playground/layers/i18n-layer/nuxt.config.ts @@ -6,7 +6,6 @@ export default defineNuxtConfig({ i18n: { langDir: 'locales', lazy: true, - baseUrl: 'http://localhost:3000', customRoutes: 'config', pages: { history: { @@ -58,5 +57,8 @@ export default defineNuxtConfig({ // name: 'Français' // } ] + }, + site: { + url: 'http://localhost:3000' } }) diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts index 894c15b11..5d7990d93 100644 --- a/playground/nuxt.config.ts +++ b/playground/nuxt.config.ts @@ -26,7 +26,6 @@ export default defineNuxtConfig({ }, langDir: 'locales', lazy: true, - baseUrl: 'http://localhost:3000', locales: [ { code: 'en', @@ -117,7 +116,6 @@ export default defineNuxtConfig({ }, langDir: 'locales', lazy: true, - baseUrl: 'http://localhost:3000', locales: [ { code: 'en', @@ -179,5 +177,8 @@ export default defineNuxtConfig({ // // redirectOn: 'root' // }, vueI18n: './vue-i18n.options.ts' + }, + site: { + url: 'http://localhost:3000' } }) diff --git a/playground/pages/blog.vue b/playground/pages/blog.vue index f20670bd8..ff5aea138 100644 --- a/playground/pages/blog.vue +++ b/playground/pages/blog.vue @@ -7,10 +7,11 @@ defineI18nRoute({ } }) -const { t, locales, baseUrl } = useI18n({ +const { t, locales } = useI18n({ useScope: 'local' }) -console.log('locales', locales, baseUrl) +const { url } = useSiteConfig() +console.log('locales', locales, url)