next.js

Question

希望 Next.js 魔术师能帮我解决这个问题，或者如果不可能的话至少直截了当地告诉我。

我们有一个编译成静态文件的网站。这些将从 S3 提供。

当我运行 next export 时，一切都正确构建，但我希望能够 直接访问 子页面而不添加 .html 扩展名。我假设（错误地）下一步将页面构建到目录中，并将 index.html 放入该目录。

开发端的设置相当简单。每个组件都有一个目录，例如“some-component”，带有一个 index.js，它从一个相邻的文件如“some-component.js”中导出 named 组件。

如果我从站点根目录开始，这一切都有效 - 我可以导航到 /components/some-component，而不用担心扩展名。

接下来创建了一个some-component目录，但是里面的文件还是叫some-component.html。所以如果我从浏览器中点击 url，它显然是 404s.

有没有办法让 next 吐出 index.html 到目录中，这样直接浏览到目录（尝试在喝完酒后说）就可以了？还是我找错树了？

我知道还有其他解决方案，特别是对于 s3，但我认为值得一问。

干杯！

Answer 1

Next.js 有一个适合您的 trailingSlash 设置：

// next.config.js
module.exports = {
  trailingSlash: true,
}

当此设置为 true 时，并使用类似 ./pages/products/shoes.jsx 的内容作为示例，将创建一个以 .jsx 文件 (shoes) 命名的目录，并且.jsx 文件然后成为该目录中的 index.html 文件，即 href="/products/shoes/"。即使 href.

中未指定 index.html，您的服务器也会发送该路径的 index.html（或者可以配置为如果尚未配置）

next.js - 导出站点的目录结构

next.js - directory structure of exported site

javascript

amazon-s3