Next.js: [i18n] Allow generation of routes with lowercase locales

Created on 5 Nov 2020  路  4Comments  路  Source: vercel/next.js

Feature request

Is your feature request related to a problem? Please describe.

In Next.js 10.0, internationalized routing generates routes that expose exact locale values into generated routes, e.g. /en-US.

Describe the solution you'd like

For ease of use by end-users and easier legibility, it should be possible to have routes generated with the entire locale part of routes generated in lowercase, e.g. /en-us. However, internally the formally correct capitalization e.g. en-US should transparently be injected so that retrieving data from external locale-aware systems (e.g. headless CMS) remains easy.

Describe alternatives you've considered

A (clumsy) alternative is to manually build a folder structure that implements the locale sub-path via dynamic routes, e.g. /[locale]/[slug].js where getStaticPaths() provides a locale converted to lowercase for locale and in getStaticProps() the correct capitalization is recalculated from the locale prop using custom code.

Additional context

In cases where the site hosting service considers URLs case-sensitive, having mixed case locales is highly unintuitive for end users and will cause a lot of problems when they manually enter URLs without considering the possibility of case sensitivity.

story

All 4 comments

Locales are already case insensitive.

Even if the hosting service matches case insensitive, routes are still generated with mixed case which reduces legibility for non-technical users.

@advancingu you can use any case for the routes you want, e.g:

module.exports = {
  // ...
  i18n: {
    // ...
    locales: [
      "en-us",
      "en-gb",
      "en",
      // ... 
    ],
    // ...
  },
  // ...
};

@rokinsky

facing the same issue.
when adding locale like en-us or en-US nextjs build fails creating pre-rendered 404 pages

Was this page helpful?
0 / 5 - 0 ratings