next-localized-routes v0.1.3

Next.js Localized Routes

Adds localized routes (e.g. /pricing in EN and /de/preise in DE) to next.js with a integrated LocalizedLink Component.

Getting started

npm i -D next-localized-routes

Create a next-i18next.config.js file if it does not already exist and add localizedPaths.

module.exports = {
  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'de', 'fr'],
    localizedPaths: [
      {
        path: '/pricing',
        locales: {
          de: '/preise',
          fr: '/prix',
        }
      },
      {
        path: '/imprint',
        locales: {
          de: '/impressum',
          fr: '/legales',
        }
      },
      {
        path: '/privacy',
        locales: {
          de: '/datenschutz',
          fr: '/confidentialite',
        }
      },
      {
        path: '/terms',
        locales: {
          de: '/nutzungsbedingungen',
          fr: '/termes',
        }
      }
    ]
  }
};

Add the plugin and the i18n config to your next.config.js

const { i18n } = require('./next-i18next.config');
const withLocalizedRoutes = require('next-localized-routes');

module.exports = withLocalizedRoutes({
  i18n,
  ...
});

Finally use the LocalizedLink Component to Link between your pages.

...
  <LocalizedLink href="/pricing">
    <a>{t('pricing')}<a>
  </LocalizedLink>