当basePath不是root时如何在Next.js中正确设置动态路由？答案

【问题标题】：How to properly set dynamic route in Next.js when basePath is not root?当basePath不是root时如何在Next.js中正确设置动态路由？
【发布时间】：2020-05-27 11:40:27
【问题描述】：

我已按照tutorial 将我的 Next.js 项目设置为驻留在网站根目录之外。（我把它放在 /app 子文件夹中）。

在我开始对几页使用动态路由之前，一切都很好。

我尝试了三种方式：

<Link href="/project/[project_id]" as="/app/project/project1">

返回错误Error: The provided 'as' value (/app/project/project1) is incompatible with the 'href' value (/project/[project_id])

<Link href="/project/project1" as="/app/project/project1">

哪种工作（它可以导航）但无法预加载下一页（我收到错误 404 - 找不到这样链接的页面）

<Link href="/app/project/project1" as="/app/project/project1">

根本不工作。

有人知道如何解决这个问题吗？

【问题讨论】：

嘿。同样的问题。你能找到解决办法吗？
不是真的，我曾一度放弃并在根目录下设置项目。真的找不到一个简单而优雅的解决方案。

标签： javascript reactjs next.js

【解决方案1】：

在你的 next.config 中设置一个basePath

basePath: '/app'

现在，从您的链接组件中删除对 /app 的所有引用。

<Link href="/project/[project_id]" as="/project/project1">

这对我们来说是正确的，并且从下一个 9.5 开始就可以使用

【讨论】：