javascriptnext.jsinternationalizationreact-intl

defaultLocale is not keeping default lang in Next.js i18n


I'm trying to make my default language in Next.js i18n but always is getting "En" as default language called like fallback.

And I also get this error:

Error: [@formatjs/intl Error MISSING_DATA] Missing locale data for locale: "sq" in Intl.NumberFormat. Using default locale: "en" as fallback

module.exports = {
    i18n: {
        locales: ['sq', 'en'],
        defaultLocale: "sq",
    }
}

Solution

  • Next.js will automatically detect which locale the user prefers based on the Accept-Language header sent in the page request.

    In your case, although your default locale is sq, the en locale is detected in the Accept-Language header so you get redirected to the locale-prefixed path.

    This behaviour can be disabled by setting localeDetection to false in your i18n options.

    // next.config.js
    
    module.exports = {
        i18n: {
            locales: ['sq', 'en'],
            defaultLocale: 'sq',
            localeDetection: false
        }
    }
    

    From the Disabling Automatic Locale Detection documentation:

    When localeDetection is set to false Next.js will no longer automatically redirect based on the user's preferred locale and will only provide locale information detected from either the locale based domain or locale path as described above.


    As a side note, regarding the @formatjs/intl error, it indicates that you're using an environment/browser that doesn't have support for the sq locale. You may want to look into @formatjs/intl-numberformat to polyfill that locale data.