Next.js执行turbo build时出现Failed to collect page data for /test错误求助

算力阿峰

2026-7-28

Next.js Turbo Build 报错：Failed to collect page data for /test 排查方案

执行命令 turbo run build --cache-dir=".turbo" 时出现错误：

Error: Failed to collect page data for /test

组件代码如下：

import { Provider, useHook } from '@test';

const Test = () => {
  return (
    <>
      <h1>Smethods</h1>
      <Provider>
        <MyPage />
      </Provider>
    </>
  );
};

export default Test;

function MyPage() {
  const { method1, method2 } = useHook();

  return (
    <>
      <button>test1</button>
      <button>test2</button>
    </>
  );
}

排查步骤

检查@test包的客户端依赖
如果useHook依赖浏览器环境（比如window、document对象），在Next.js build的服务端渲染阶段会直接报错。可以用next/dynamic动态导入MyPage并禁用SSR：

import dynamic from 'next/dynamic';
const MyPage = dynamic(() => import('./MyPage'), { ssr: false });

或者在useHook调用前增加环境判断：

function MyPage() {
  const hookData = typeof window !== 'undefined' ? useHook() : { method1: () => {}, method2: () => {} };
  const { method1, method2 } = hookData;
  // ... 原有代码
}

标记组件为客户端组件
@test的Provider和Hook可能仅支持客户端运行，在Test组件顶部添加'use client'指令，强制组件在客户端执行：
```
'use client';
import { Provider, useHook } from '@test';

const Test = () => {
  // ... 原有代码
};
```
清除Turbo缓存重试
缓存残留可能导致错误状态无法更新，执行以下命令清除缓存后重新构建：
```
rm -rf .turbo node_modules/.cache
turbo run build --cache-dir=".turbo"
```
获取详细错误堆栈
执行build命令时添加--verbose参数，查看完整报错信息，定位具体出错位置：
```
turbo run build --cache-dir=".turbo" --verbose
```