Next.js部署至Netlify后仅根布局显示，其他页面404求助

你的netlify.toml配置存在两处关键问题：多余的仓库名前缀、缺少Next.js SPA必需的 fallback 重定向，这直接导致了子页面404的情况。

修改netlify.toml为以下内容：

[[redirects]]
from = "/*"
to = "/index.html"
status = 200

[[redirects]]
from = "/_next/image/*"
to = "/.netlify/images?url=:url&w=:width&q=:quality"
status = 200

[redirects.query]
url = ":url"
w = ":width"
q = ":quality"

修改说明： #

• 第一条重定向是核心：将所有路径 fallback 到index.html，让Next.js的客户端路由接管页面跳转，解决直接访问或刷新子页面时的404问题。
• 删除了错误的/Facebook-Clone/_next/image路径——Netlify部署的站点根为/，无需添加仓库名前缀，改为通用的/_next/image/*适配Next.js图片服务。
• 移除了无用的context配置块，你的场景下不需要该配置。

额外检查：
如果你的项目在GitHub Pages部署时配置了basePath（对应仓库名），需要确保Netlify部署时移除该配置，或通过环境变量区分部署环境，避免路径冲突。

修改完成后提交代码，重新部署Netlify即可解决问题。

内容的提问来源于stack exchange，提问作者Hussein