0

I am building a Nuxt app with multiple locales. Nuxt seems to generate hreflang tags in head automatically, but it generates duplicate for each locale, e.g.:

<link data-n-head="ssr" data-hid="i18n-alt-fr" rel="alternate" href="https://example.com/fr-FR/" hreflang="fr">
<link data-n-head="ssr" data-hid="i18n-alt-fr-FR" rel="alternate" href="https://example.com/fr-FR/" hreflang="fr-FR">

Is there a way to control it anyhow? I am posting i18n section from my nuxt.config.js file for reference:

i18n: {
  lazy: true,
  langDir: 'i18n/',
  locales: [
    {
      code: 'en',
      iso: 'en',
      file: 'en.json',
      name: 'English',
    },
    {
      code: 'de-DE',
      iso: 'de-DE',
      file: 'de.json',
      name: 'Deutsch',
    },
    {
      code: 'nl-NL',
      iso: 'nl-NL',
      file: 'nl.json',
      name: 'Nederlands',
    },
    {
      code: 'fr-FR',
      iso: 'fr-FR',
      file: 'fr.json',
      name: 'Français',
    },
  ],
  baseUrl: 'https://example.com',
  defaultLocale: 'en',
  vueI18n: {
    fallbackLocale: 'en',
  },
  seo: true,
  strategy: 'prefix_except_default',
},
kissu
  • 40,416
  • 14
  • 65
  • 133
irwin
  • 115
  • 1
  • 2
  • 10
  • I think this behavior is intended. From test [here](https://github.com/nuxt-community/i18n-module/blob/master/test/module.test.js#L210-L221). – User 28 May 12 '21 at 15:38
  • In your case, I believe that you can use `iso: 'fr'`. – User 28 May 12 '21 at 15:52
  • Thanks for pointing me to the right direction. I have reviewed nuxt module code and it seems to me this is intended and it will not be clever enough to compare region part with language link already existing. For instanmce for an `en`, and `en-GB` we will always get a duplicate but `de` and `de-DE` we will not. I logged issue with nuxt community, maybe they will have a look and respond. – irwin May 14 '21 at 14:28

1 Answers1

0

I don't know if its a good solution, but you can remove them in layouts/default.vue with :

export default {
  head () {
    if (!this.$nuxtI18nHead) {
      return ''
    }

    // Issue : https://github.com/nuxt-modules/i18n/issues/1170
    const head = this.$nuxtI18nHead({ addSeoAttributes: true })
    head.link = head.link.filter(item => (item.hreflang && item.hreflang.includes('-')))
    return head
  },
}

I hope it will help you :)

Anvena
  • 44
  • 2