CODEWITHSUNDEEP
vue.jsnuxt.jshreflang
irwin
irwin

Reputation: 127

Nuxt application generates duplicate hreflang for each locale

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',
},

Upvotes: 0

Views: 1439

Answers (1)

Anv
Anv

Reputation: 44

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 :)

Upvotes: 0

Related Questions