Handle not-found with internalization :C
Unanswered
Sokoke posted this in #help-forum
SokokeOP
Hey everyone,
I can't figure out how to handle a custom not-found page with internaliazation in my project.
I'm using Next.js 14 with App router I have the following -> /src/app/[lang]/not-found.tsx
The issue is usually in Next.js without internalization you just put the not-found.tsx into the /app folder and voilà.
But according to this GitHub discussion : https://github.com/vercel/next.js/issues/50699
I don't think there is a simple way to do it. I tried the solutions in the posts but it didn't work for me :/
Any tips, or help appreciated !
I can't figure out how to handle a custom not-found page with internaliazation in my project.
I'm using Next.js 14 with App router I have the following -> /src/app/[lang]/not-found.tsx
The issue is usually in Next.js without internalization you just put the not-found.tsx into the /app folder and voilà.
But according to this GitHub discussion : https://github.com/vercel/next.js/issues/50699
I don't think there is a simple way to do it. I tried the solutions in the posts but it didn't work for me :/
Any tips, or help appreciated !
6 Replies
White-crowned Pigeon
in my case next 15 seems to render not-found.tsx at the root of /app but not /app/[lang]/not-found.tsx
and the error comes with needing <html><body> to render, so my solution is
import Link from 'next/link';
export default function NotFound() {
return (
<html>
<body>
<div>
<h2>Not Found</h2>
<p>Could not find requested resource</p>
<Link href="/">Return Home</Link>
</div>
</body>
</html>
);
}
export default function NotFound() {
return (
<html>
<body>
<div>
<h2>Not Found</h2>
<p>Could not find requested resource</p>
<Link href="/">Return Home</Link>
</div>
</body>
</html>
);
}
just put the not-found.tsx at /app
it works now !
White-crowned Pigeon
i think next team should have thought of allowing middleware to pass locale or any extra data directly to layout.tsx but not only via [slug]/ and if they modified the mechanism , we dont need to organize localization like /app/[lang]/ we just start with simple /app