Next.js 13.4.6（App Router）部署至Netlify后页面导航刷新问题咨询

嗨，我之前也碰到过几乎一样的情况，先别怀疑自己的代码——Netlify是完全支持Next.js 13 App Router的，大概率是部署配置或者一些细节没处理到位，我给你梳理几个排查方向：

• 检查Netlify的Next.js构建插件版本
  Netlify的@netlify/plugin-nextjs插件需要和你的Next.js版本匹配，13.4.6属于比较稳定的版本，但要确保你用的插件是支持这个版本的。可以在项目根目录的netlify.toml里明确指定插件版本：

  [[plugins]]
    package = "@netlify/plugin-nextjs"
    version = "^4.39.0"
  

  这个版本对13.4.x的App Router兼容性很好，要是之前没指定版本，Netlify可能默认用了旧版本，导致路由逻辑异常。

• 确认导航链接的组件使用
  一定要用Next.js自带的next/link组件做客户端导航，别用原生的<a>标签！要是不小心写了<a href="/your-page">，浏览器会触发整页刷新，而Vercel可能在某些场景下做了兼容，但Netlify这边会严格遵循浏览器默认行为。检查所有导航链接，替换成：

  import Link from 'next/link';
  
  // 正确用法
  <Link href="/your-page">你的页面</Link>
  

• 配置Netlify的路由重写规则
  App Router依赖正确的服务器端路由转发，确保netlify.toml里添加了重写规则，让所有请求都指向Next.js的入口：

  [[redirects]]
    from = "/*"
    to = "/:splat"
    status = 200
  

  没有这个配置的话，Netlify可能会把某些路由当成静态文件处理，导致导航时触发刷新。

• 清除Netlify构建缓存重新部署
  有时候旧的构建缓存会残留一些异常配置，去Netlify控制台的「Deploys」页面，找到最近的部署，点击「Clear cache and deploy site」重新构建一次，很多奇怪的问题都能通过这个操作解决。

如果以上方法都试过还是不行，可以去Netlify部署日志里看看有没有构建阶段的报错，比如依赖安装失败、构建命令配置错误之类的。另外，13.4.6之后的小版本（比如13.4.19）对Netlify的兼容性做了优化，也可以尝试升级Next.js版本试试。

备注：内容来源于stack exchange，提问作者Gopal Adhikari