英文:
How do I prevent a 404 with dynamic routes in NextJS 13?
问题
我有一个使用Next.js 13的应用，它有一个非常简单的文件夹结构：
- app
- users
- [id]
- page.tsx
- ...
还有一个`page.tsx`文件，内容类似于以下内容：
export default function UserPage({ params }) {
return <div>{params.id}</div>;
}
然而，当我运行`next dev`并访问`/users/1`时，我得到了一个404错误。我是否遗漏了关于NextJS 13中动态路由如何工作的某些信息？
英文:
I have a Next13 app with an incredibly simple folder structure:
- app
- users
- [id]
- page.tsx
- ...
And a page.tsx with content similar to the following:
export default function UserPage({ params }) {
return <div>{params.id}</div>
}
However, when I run next dev and go to /users/1, I get a 404. Is there something I'm missing about how dynamic routes work in NextJS 13?
答案1
得分: 4
在我的情况下，问题出现在区域设置中。这是版本13.2.x中已知的问题。
修复的临时方法是在 next.config.js 中删除区域设置：
/** @type {import('next').NextConfig} */
const nextConfig = {
// i18n: {
// locales: ["en"],
// defaultLocale: "en"
// },
experimental: {
appDir: true,
},
}
module.exports = nextConfig
英文:
In my case, the problem was in the locale settings. This is a known bug in version 13.2.x.
A temporary way to fix this is to remove the locale settings in next.config.js:
/** @type {import('next').NextConfig} */
const nextConfig = {
// i18n: {
// locales: ["en"],
// defaultLocale: "en"
// },
experimental: {
appDir: true,
},
}
module.exports = nextConfig
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论