NextJS/Sanity构建报错：Failed to collect page data问题求助

问题根源 #

你切换到空白Sanity项目后，该项目内没有任何industries类型的文档。NextJS执行npm run build时，会为动态路由页面预取对应数据以生成静态页面，无数据时就会触发Failed to collect page data错误。

解决方案 #

1. 给新Sanity项目添加测试数据 #

• 登录新Sanity项目后台，创建至少一条industries类型的文档，确保文档包含符合页面要求的slug字段。
• 重新执行npm run build，此时NextJS能获取到数据，即可正常生成静态页面。

2. 修改页面逻辑兼容无数据场景 #

如果暂时不想添加测试数据，可修改/pages/industries/[slug].tsx的数据获取逻辑：

• 在getStaticPaths中判断，无数据时返回空路径并开启动态 fallback：

export async function getStaticPaths() {
  const industries = await fetchIndustriesFromSanity();
  
  if (!industries || industries.length === 0) {
    return {
      paths: [],
      fallback: 'blocking', // 也可设为true，按需选择
    };
  }

  const paths = industries.map(industry => ({
    params: { slug: industry.slug.current },
  }));

  return { paths, fallback: false };
}

• 在getStaticProps中，若获取不到对应slug的数据，返回{ notFound: true }，避免构建失败。

3. 临时排除该页面构建（仅测试用） #

在next.config.js中配置临时排除该页面：

module.exports = {
  experimental: {
    excludeRoutes: ['/industries/[slug]'],
  },
};

注意：此方法仅用于临时测试，上线前必须移除，否则该页面无法正常访问。

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