Next.js Vercel Deployment Error: Failed to Collect Page Data for /api/favourites/[drivingSchoolId]

Help
1

Hello, I’m trying to deploy my Next.js application to Vercel, but I’m encountering a build error related to a specific API route. The error message indicates that there was a failure in collecting page data for /api/favourites/[drivingSchoolId], and the build process exits with code 1. Below is the relevant part of the error log:

Error message:

 at fa (/vercel/path0/node_modules/@prisma/client/runtime/library.js:33:69)
    at new t (/vercel/path0/node_modules/@prisma/client/runtime/library.js:131:739)
    at 13543 (/vercel/path0/.next/server/app/api/favourites/[drivingSchoolId]/route.js:1:3921)
    at t (/vercel/path0/.next/server/webpack-runtime.js:1:128)
    at 91782 (/vercel/path0/.next/server/app/api/favourites/[drivingSchoolId]/route.js:1:2942)
    at t (/vercel/path0/.next/server/webpack-runtime.js:1:128)
    at 40100 (/vercel/path0/.next/server/app/api/favourites/[drivingSchoolId]/route.js:1:1267)
    at t (/vercel/path0/.next/server/webpack-runtime.js:1:128)
    at t (/vercel/path0/.next/server/app/api/favourites/[drivingSchoolId]/route.js:1:4006)
    at /vercel/path0/.next/server/app/api/favourites/[drivingSchoolId]/route.js:1:4041 {
  clientVersion: '5.16.2',
  errorCode: undefined
}
> Build error occurred
Error: Failed to collect page data for /api/favourites/[drivingSchoolId]
    at /vercel/path0/node_modules/next/dist/build/utils.js:1268:15
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  type: 'Error'
}
Error: Command "npm run build" exited with 1
2

Hi, and welcome @dodowojnar-seznamcz!

We’d need some more information on your code. Would you mind sharing how you’ve set up your app?

In the meantime, you can also check out some suggestions from the community: Solving "Failed to collect page data. TypeError: (0 , _react.createContext) is not a function" · vercel/next.js · Discussion #50955 · GitHub

3

Hello, Yes sure I will provide more info.
my /api/favourites/[drivingSchoolId] route code

import { NextResponse } from "next/server";

import getCurrentUser from "@/app/actions/getCurrentUser";
import prisma from "@/app/libs/prismadb";

interface IParams {
    drivingSchoolId?: string;
}

export async function POST(request: Request, { params }: { params: IParams }) {
    const currentUser = await getCurrentUser();
    if (!currentUser) return NextResponse.error();

    const { drivingSchoolId } = params;

    if (!drivingSchoolId) {
        return NextResponse.json({ success: true, message: "Tato autoškola není dostupná" }, { status: 400 });
    }

    const alreadyExists = await prisma.user_favourite_car_driving_school.findFirst({
        where: {
            AND: [{ user_id: currentUser.user_id }, { driving_school_id: Number(drivingSchoolId) }],
        },
    });

    if (alreadyExists) return NextResponse.json({ success: true, message: "Počkejte chvílu, ukládám záznam" }, { status: 400 });

    await prisma.user_favourite_car_driving_school.create({
        data: {
            user_id: currentUser.user_id,
            driving_school_id: Number(drivingSchoolId),
        },
    });

    return NextResponse.json({ success: true, message: "Označeno jako oblíbené" }, { status: 200 });
}

export async function DELETE(request: Request, { params }: { params: IParams }) {
    const currentUser = await getCurrentUser();

    if (!currentUser) return NextResponse.error();

    const { drivingSchoolId } = params;

    if (!drivingSchoolId) return NextResponse.json({ success: true, message: "Tato autoškola není dostupná" }, { status: 400 });

    await prisma.user_favourite_car_driving_school.deleteMany({
        where: {
            AND: [{ user_id: currentUser.user_id }, { driving_school_id: Number(drivingSchoolId) }],
        },
    });

    return NextResponse.json({ success: true, message: "Zrušeno oblíbené" }, { status: 200 });
}

my tsconfig.json

{
    "compilerOptions": {
        "lib": ["dom", "dom.iterable", "esnext"],
        "allowJs": true,
        "skipLibCheck": true,
        "strict": true,
        "noEmit": true,
        "esModuleInterop": true,
        "module": "esnext",
        "moduleResolution": "Node",
        "resolveJsonModule": true,
        "isolatedModules": true,
        "jsx": "preserve",
        "incremental": true,
        "plugins": [
            {
                "name": "next"
            }
        ],
        "paths": {
            "@/*": ["./*"]
        }
    },
    "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
    "exclude": ["node_modules"]
}
4

Hi, @dodowojnar-seznamcz!

Thanks for your patience :pray:

After taking a look at your code, it looks like the issue is likely related to Prisma client initialization or database connection during the Vercel deployment process.

Some ideas on how to troubleshoot this:

  • Adding a postinstall script to generate the Prisma client during build.
  • Verifying the database connection string in Vercel’s environment variables.
  • Updating the Prisma client initialization to use a singleton pattern.
  • Implementing error handling in the API route.
  • Checking compatibility between Prisma and Next.js versions.
  • Verifying the Prisma schema against the database structure.

Let us know how you get on!

5

I also spotted this on Twitter, unsure if it’s related to your issue but might be worth sharing: x.com

6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.