Next.js 动态路由加载不存在的脚本导致 404

Question

为了使用动态路由，我创建了一个pages/[slug].js 页面并按照建议链接到它：

<Link href="/shop/[slug]" as={`/shop/${item.slug}`}>
  <a>{item.title}</a>
</Link>

我已遵循 Next.js 文档：

• https://nextjs.org/docs/routing/dynamic-routes
• https://nextjs.org/docs/api-reference/next/link#dynamic-routes

链接和页面在本地运行next dev 后按预期工作，但是在生产中（或在构建应用程序并在本地运行next start 后），导航到动态路由后，系统地加载了一个不存在的脚本.它不会使应用程序崩溃，但会生成带有 404 状态代码的请求。 脚本从/_next/static/___/pages/shop/example-page.js加载。

可能是什么原因？

Answer 1

事实证明，这是因为页面上的虚拟占位符链接：<Link href="#"><a>Home</a></Link>。用工作链接替换它们解决了这个问题。