I'm using next-intl and I have error with route navigation

169 views Asked by At

I'm using next-intl and I have an error with route navigation. Currently, I'm unable to access the page after having made the configurations as the documentation instructs. It seems like it's not locating the path. Can someone help me?

My Middleware.ts


import createIntlMiddleware from 'next-intl/middleware';
import {NextRequest} from 'next/server';
import { localePrefix, locales } from './navigation';

export default async function middleware(request: NextRequest) {
  const defaultLocale = request.headers.get('x-your-custom-locale') || 'pt'

  const handleI18nRouting = createIntlMiddleware({
    localePrefix,
    locales,
    defaultLocale,
    alternateLinks: false
  });
  const response = handleI18nRouting(request);
  response.headers.set('x-your-custom-locale', defaultLocale);
  return response;
}

export const config = {
  matcher: ['/((?!_next|.*\\..*).*)']
};

My navigation.ts

import {
  createLocalizedPathnamesNavigation,
  Pathnames
} from 'next-intl/navigation';

export const locales = ['pt', 'en'] as const
export const localePrefix = 'never'

export const pathnames = {
  '/about': {
    en: '/about',
    pt: '/sobre'
  },

  '/contact': {
    en: '/contact',
    pt: '/contato'
  },

} satisfies Pathnames<typeof locales>;
  console.log(pathnames)
export const {Link, redirect, usePathname, useRouter, getPathname} =
createLocalizedPathnamesNavigation({locales, localePrefix, pathnames});

Has anyone else experienced this same problem or something similar? How can I troubleshoot since apparently my code is as the documentation instructs?

0

There are 0 answers