baseUrl defined as function not working

[AndersCV]

Environment

---

- Operating System: Linux
- Node Version:     v18.20.3
- Nuxt Version:     3.13.2
- CLI Version:      3.14.0
- Nitro Version:    2.9.7
- Package Manager:  [email protected]
- Builder:          -
- User Config:      -
- Runtime Modules:  -
- Build Modules:    -
------------------------------

Reproduction

https://stackblitz.com/edit/nuxt-starter-qqn2vx

Describe the bug

in nuxt.config.ts define baseUrl as a function returning a string is not working correctly.

Problematic for apps with differentDomains: true as the canonical url generated by the module for SEO purposes always points the defaultLocales domain regardless for the current active locale.

Additional context

No response

Logs

No response

[drzastwakamil]

I'am experiencing same issue. My i18n config:

i18n: {
    lazy: true,
    // works perfectly fine
    baseUrl: 'https://somedomain.com',
    // never gets executed
    // baseUrl: () => {
    //   return 'https://somedomain.com';
    // },
    langDir: 'locales',
    strategy: 'prefix_except_default',
    defaultLocale: 'de',
    locales: [
      {
        code: 'de',
        language: 'de',
        name: 'DE',
        files: ['german/de.locale.common.json', 'german/de.locale.units.json', 'german/de.locale.searchQuestions.json'],
      },
      {
        code: 'en',
        language: 'en',
        name: 'EN',
        files: [
          'english/en.locale.common.json',
          'english/en.locale.units.json',
          'english/en.locale.searchQuestions.json',
        ],
      },
    ],
  }

For some reason the function never gets executed.

[drzastwakamil]

I found a solution which I'am satisfied with. Might also help you. It's not ideal but it's working. I modify the baseURL using a Nuxt Plugin.

// plugins/i18dynamicBaseUrl.ts
export default defineNuxtPlugin((nuxtApp) => {
  // @ts-ignore
  nuxtApp.$i18n.baseUrl = useRequestURL().origin;
});

I use the useRequest() function since I want the baseURL to be dynamic based on the domain. But you can put any operations you want there.

I am not sure if that's a safe approach also however the result of useLocaleHead included the baseUrl in the paths so it looks like the Seo Requirements are met with this approach.

[AndersCV]

Ah yes that looks like a pretty good workaround meanwhile! Thanks for sharing.

[ccaa7530]

I found a solution which I'am satisfied with. Might also help you. It's not ideal but it's working. I modify the baseURL using a Nuxt Plugin.

// plugins/i18dynamicBaseUrl.ts
export default defineNuxtPlugin((nuxtApp) => {
  // @ts-ignore
  nuxtApp.$i18n.baseUrl = useRequestURL().origin;
});

I use the useRequest() function since I want the baseURL to be dynamic based on the domain. But you can put any operations you want there.

I am not sure if that's a safe approach also however the result of useLocaleHead included the baseUrl in the paths so it looks like the Seo Requirements are met with this approach.

Thanks for you sharing, but it doesn't work to ssg, cuz the origin is localhost when build

[drzastwakamil-venturelabs]

I found a solution which I'am satisfied with. Might also help you. It's not ideal but it's working. I modify the baseURL using a Nuxt Plugin.

// plugins/i18dynamicBaseUrl.ts
export default defineNuxtPlugin((nuxtApp) => {
  // @ts-ignore
  nuxtApp.$i18n.baseUrl = useRequestURL().origin;
});

I use the useRequest() function since I want the baseURL to be dynamic based on the domain. But you can put any operations you want there. I am not sure if that's a safe approach also however the result of useLocaleHead included the baseUrl in the paths so it looks like the Seo Requirements are met with this approach.

Thanks for you sharing, but it doesn't work to ssg, cuz the origin is localhost when build

You're right. For SSG this solution will not work. However if you know the name of the domain and you can just hardcode it. Instead of using the useRequestURL().origin just put the string value.

[BobbieGoede]

Closing this as the baseUrl function configuration is deprecated and will be removed in the future.