Next.js部署Netlify后主页面空白，重定向失效求助

1. 确认Netlify Next.js插件启用 #

Netlify处理Next.js路由依赖官方的Next.js插件，未启用会导致重定向规则失效。前往Netlify项目的「Plugins」页面，确保「Next.js」插件已激活，部署时查看日志确认插件正常加载。

2. 修正重定向规则写法 #

根据使用的配置文件，选择对应正确规则：

• public/_redirects文件（需放在public目录下）：

  /*    /home   200
  

  使用200状态码实现URL重写（而非跳转），保持地址栏不变的同时渲染/home页面。
• netlify.toml配置：

  [[redirects]]
    from = "/*"
    to = "/home"
    status = 200
    force = true
  

  添加force=true强制触发重定向，避免缓存干扰。
• next.config.js（Pages Router）：

  module.exports = {
    async redirects() {
      return [
        {
          source: '/',
          destination: '/home',
          permanent: false,
        },
      ]
    },
  }
  

  permanent=false设置临时重定向，防止浏览器缓存旧规则。

3. 检查页面组件与根路径文件 #

• 确保home.js（Pages Router）或app/home/page.js（App Router）是默认导出的有效React组件，无语法错误：

  // Pages Router 示例
  export default function Home() {
    return <div>主页内容</div>
  }
  

• 若保留根路径的index.js（Pages Router）或app/page.js（App Router），检查是否返回空内容（如null），可直接在该文件中导入并渲染Home组件，或删除该文件让重定向规则生效。

4. 清除缓存重新部署 #

Netlify可能缓存旧构建产物导致新规则不生效。在Netlify控制台的部署详情页，点击「Clear cache and deploy site」重新构建部署。

5. App Router专属处理 #

若使用App Router，可直接在根路径的app/page.js中添加客户端重定向：

'use client'
import { redirect } from 'next/navigation'

export default function RootPage() {
  redirect('/home')
  return null
}

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