Different domains with multiple languages each

[toooni]

I am not a 100% sure if this really isn't possible yet, but it seems like it isn't. We have multiple TLD's and one of them (.ch) needs to have two languages which should result in the following domain/path/locale combinations:

• weekend4two.ch de-CH
• weekend4two.ch/fr fr-CH
• weekend4two.de de-DE
• weekend4two.at de-AT
• weekend4two.fr/fr OR weekend4two.fr fr-FR (We do not really care since the .fr TLD does only need one language)

I've tried a few configs to achieve what I need but had no success. This one was the closest:

/* nuxt.config.js */
...
i18n: {
  differentDomains: true,
  strategy: 'prefix_except_default',
  locales: [
    {
      code: 'de-CH',
      iso: 'de-CH',
      domain: 'weekend4two.ch',
    },
    {
      code: 'fr-CH',
      iso: 'fr-CH',
      domain: 'weekend4two.ch',
    },
    {
      code: 'fr-FR',
      iso: 'fr-FR',
      domain: 'weekend4two.fr',
    },
    {
      code: 'de-DE',
      iso: 'de-DE',
      domain: 'weekend4two.de',
    },
    {
      code: 'de-AT',
      iso: 'de-AT',
      domain: 'weekend4two.at',
    },
  ],
}
...
  
/* index.vue */
...
<script>
export default {
  nuxtI18n: {
    paths: {
      de: '/',
      fr: '/fr',
      'fr-CH': '/fr',
    },
  },
}
</script>
...

The seems to result in a working solution where all the domains/path exist. But when going to weekend4two.ch/fr, the locale is set to de-CH. Whatever I do, it takes the locale of the first entry with the same domain.

Describe the solution you'd like

It would be cool if the locales config in nuxt.config.js could be extended with a prefix property like this:

/* nuxt.config.js */
locales: [
  {
    code: 'de-CH',
    iso: 'de-CH',
    domain: 'weekend4two.ch',
    prefix: '', /* could be removed too */
  },
  {
    code: 'fr-CH',
    iso: 'fr-CH',
    domain: 'weekend4two.ch',
    prefix: '/fr',
  },
  ...
]

Describe alternatives you've considered

I am open to all alternatives. It may be possible that it even is possible in a way I haven't figured out yet. I am new to NUXT.

[andorfermichael]

I would appreciate that too.

[lfglopes]

Hello all,

I face the same requirement and attempted to forked this repo and add (in a quick and dirty manner) support for this.

See commit https://github.com/visayasolutions/i18n-module/commit/af22fdaebc47c51e7fb0b068f151bbdc1f485d31

If you want to try it out

npm install https://github.com/visayasolutions/i18n-module.git#feature/domains-with-prefix

The configuration I use is the following:

  {
    code: 'nl_BE',
    file: 'nl-BE.js',
    prefix: '/nl',
    domain: 'be.app.local:3003',
  },
  {
    code: 'fr_BE',
    file: 'fr-BE.js',
    prefix: '/fr',
    domain: 'be.app.local:3003'
  }

Haven't tested it extensively, consider it a proof of concept.

I'm open to any feedback, thanks

[toooni]

Hi @lfglopes I've just tried your solution with my desired config and it works perfectly! Since I am not very familiar with nuxt and the other strategies, I am not able to tell from your source if something might be problematic.

[algj]

This is a lot to write when there's a lot of domains (6) and couple of languages (4), in total 24 "locales". There should be a better solution maybe, like seperate section for domains and defaultLocale for each of them.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[marcmalerei]

I face the same requirements. Would be great if the solution provide by @lfglopes could be merged.

[nikolashaag]

I have the same requirements for a page that has multiple locales on each domain. This seems like a common usecase, so would be great if this can get merged!

[coeurofbear]

Same here, it'd be great if this gets merged! 🤞

[mbomfim33]

Our company has been using a forked version of the plugin for quite some time now due to this issue being staled, it would be cool to have it merged. Is there something I can do to get this moving forward?

[rchl]

I don't see any PR that could be merged.

[mbomfim33]

@lfglopes think you can get a PR open with your changes? If not I can raise one, just don't want to take your credits for it 😄

[lfglopes]

@MarcoBomfim thanks for reaching out!

I didn't open a PR back then because I assumed the code was not good enough as it is.

Which after reading the contributing guidelines and running lint on it, I can confirm :P

I can attempt some changes tomorrow and see if it works out. I'd assume one might need to update docs as well? Something else?

[lfglopes]

@MarcoBomfim please go ahead and submit a PR :)

I haven't used nuxt for a little while and I need more time than I can afford right now to fix the code.

[rchl]

I don't want to discourage anyone but a certain level of quality is required for a PR to be accepted. The change should have tests, be added to documentation if it's a feature or behavior change, pass the lint checks and in general fit the design of the module. The last one is a bit hard to quantify so it could be discussed before the PR to avoid wasting anyone's time.

[mbomfim33]

Thanks folks. I'll be working on the PR mentioned above, but it may take some time since I'm slowly getting the hang of how everything works. @rchl should I move any further discussion to the PR instead?

[rchl]

The high level design of the change could be discussed before PR to avoid wasting time on implementation that would potentially be rejected but it's up to you.

[mbomfim33]

My initial idea was to create a new strategy, and follow the logic for PREFIX_AND_DEFAULT under @/src/helpers/routes.js. Something like DOMAINS_AND_PREFIX or MULTIPLE_LOCALES_SINGLE_DOMAIN.

Assuming the following configuration:

i18n {
    baseUrl: 'nuxt-app.localhost',
    strategy: 'multiple_locales_single_domain',
    defaultLocale: 'en-ca',
    locales: [
      {
        code: 'en',
        iso: 'en',
        name: 'English',
        domain: 'en.nuxt-app.localhost'
      },
      {
        code: 'en-ca',
        iso: 'en-CA',
        name: 'Canadian English',
        domain: 'ca.nuxt-app.localhost',
        suffix: '/en'                                     // Required for multiple languages per domain
      },
      {
        code: 'fr-CA',
        iso: 'fr-CA',
        name: 'Canada Français',
        domain: 'ca.nuxt-app.localhost',
        suffix: '/fr'
      }
    ],
    ...
}

What needs to happen then, is that to build the localizedRoute, we would have to verify a couple of things:

1. The route belongs to defaultLocale and is the defaultLanguage? If so, don't add anything to the route (ie. ca.nuxt-app.localhost/*). If not, we would have to include a suffix for the language (ie. ca.nuxt-app.localhost/fr/*)

2. The route belongs to a different domain? If it does, the route should be built using the proper domain name. (ie en.localhost/* instead of ca.nuxt-app.localhost/en/*)

As far as I've seen walking around the module this seems to cover enough ground for a multi-lang per domain feature to be implemented. Although I have a couple of questions still:

• Is there anything I'm missing here?
• Does this follows the module design? Is there anything I could change here in order to be in accordance with it?

[golubvladimir]

What about my path for fix this problem - https://github.com/golubvladimir/nuxt-i18n-different-domains-and-prefixes , I use https://github.com/nuxt-community/router-module for creating custom Nuxt router.