I’m using the deufakt i18n localization plugin to translate a webpage, but I want to turn off localization for my /blog
route.
Basically what I want is this:
mypage.com/es/anotherRoute
-> mypage.com/blog
(The es
or any other language code goes away)
But that’s not the main thing I want to achieve. The biggest problem is I’m not able to build the next app.
The error is basically that the post
in [slug]
is undefined when it’s getting prerendered. Although it shouldn’t be, because if I console.log it, it’s there.
import ErrorPage from "next/error";
import { getStrapiURL, getPageData, getBlogPost } from "utils/api";
import Sections from "@/components/sections";
import Seo from "@/components/elements/seo";
import { useRouter } from "next/dist/client/router";
import BlogPost from "@/components/blog/blogPost";
const BlogPage = ({ post, allPosts }) => {
const router = useRouter();
if (router.isFallback) {
return <div className="container">Loading...</div>;
}
return (
<>
{/* Add meta tags for SEO*/}
<Seo metadata={post.metadata} />
{/* Display content sections */}
<BlogPost {...{ post, allPosts }} />
</>
);
};
export async function getStaticPaths() {
const blogPosts = await (await fetch(getStrapiURL("/blog-posts"))).json();
const paths = blogPosts.map((page) => {
return {
params: { slug: page.slug },
};
});
return { paths, fallback: true };
}
export async function getStaticProps({ params, preview = null }) {
const pageData = await getBlogPost(params.slug);
const allPosts = await (await fetch(getStrapiURL("/blog-posts"))).json();
if (pageData == null) {
// Giving the page no props will trigger a 404 page
return { props: {} };
}
return {
props: {
post: pageData,
allPosts,
},
revalidate: 1,
};
}
export default BlogPage;
My pages
folder:
pages
├── [[...slug]].js
├── _app.js
├── _document.js
└── blog
├── [slug].js
└── index.js
3
Answers
There is
ignoreRoutes
property ini18n
plugin configUPD: It is no longer valid, so now we are free to work around this as we want
The link to github discussion provided by @neuroine in comments, might prove useful:
https://github.com/vercel/next.js/discussions/28554
If someone is looking to use an
/api
route it’s possible if you just add to the<Link href="/api/auth/" locale={false}/>
.https://nextjs.org/docs/api-reference/next/link
I was doing a similar thing, i needed to disable any defined locales but default one (there are different default locales for different app instances)
It has been done by