如何处理带有 .html 扩展名但在 <Link> 中没有 .html 的 NextJS 导出文件

Question

所以，我有一个 NextJS 应用程序，我构建链接的方式是通过组件。例如：<Link href="/my-page"><a>My page</a></Link>。我已经使用这种模式构建了整个应用程序，但是，当我进行导出以生成静态站点时，它创建了带有 .html 扩展名的页面的 out 文件夹。这现在是一个问题，因为说一个链接可能指向/my-page但实际页面是/my-page.html. 处理这个问题的正确方法是什么？NextJS 是否允许我们在这种情况下做任何事情，还是我需要返回并使用/my-page.html链接对所有标签进行编码？

谢谢。

Answer 1

next.js 中静态生成的默认值是映射此代码：

/pages/p1.tsx

到这个文件：

/p1.html

问题在于，当您使用下一个服务器时，指向 /p1 的链接将起作用，而在提供静态文件时将失败。

如果启用此功能，请在 next.config.js 中：

module.exports = {trailingSlash: true,}

然后你会得到一个不同的文件：

/p1/index.html

在大多数通用 Web 服务器（例如，开箱即用的 Apache）上，您会得到以下行为：

/p1 - redirects to /p1/
/p1/ - serves /p1/index.html
/p1/index.html - serves /p1/index.html

所以我认为module.exports = {trailingSlash: true,}让你得到你期望的行为。

（@jdaz 指向另一个答案的链接对此绝对有用，但该问题非常具体地关于配置 .htaccess，所以我在这里重复类似的答案）