#Error Deploying to Vercel

1 messages · Page 1 of 1 (latest)

molten lodge
#

Failed to compile.
src/app/api/posts/[slug]/route.ts
Type error: Route "src/app/api/posts/[slug]/route.ts" has an invalid "GET" export:
Type "{ params: { slug: string; }; }" is not a valid type for the function's second argument.
Next.js build worker exited with code: 1 and signal: null
Error: Command "pnpm next build" exited with 1

export const runtime = 'nodejs'

import { getPostBySlug } from '@/lib/api'
import { NextResponse, type NextRequest } from 'next/server'

export async function GET(
request: NextRequest,
context: { params: { slug: string } }
) {
const { slug } = context.params
const post = getPostBySlug(slug)

if (!post) {
    return NextResponse.json({ error: 'Not found' }, { status: 404 })
}

return NextResponse.json(post)

}

How do I fix this error when deploying to vercel?

ancient saffronBOT
#

Hi @molten lodge. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

The error you're encountering is related to a breaking change in Next.js 15, where params and searchParams are now Promise-based in route handlers.

How to fix the error

You need to update your route handler to handle the params as a Promise. Here's how to fix your code:

export const runtime = 'nodejs'

import { getPostBySlug } from '@/lib/api'
import { NextResponse, type NextRequest } from 'next/server'

export async function GET(
    request: NextRequest,
    { params }: { params: Promise<{ slug: string }> }
) {
    const resolvedParams = await params
    const { slug } = resolvedParams
    const post = getPostBySlug(slug)

    if (!post) {
        return NextResponse.json({ error: 'Not found' }, { status: 404 })
    }

    return NextResponse.json(post)
}

This change is documented in the Next.js 15 upgrade guide under "Async Request APIs" as a breaking change. In Next.js 15, the params object in route handlers is now a Promise that needs to be awaited before accessing its properties.

Why this happens

In Next.js 15, dynamic route parameters (params) and search parameters (searchParams) are now asynchronous. This means they're wrapped in a Promise that needs to be resolved before you can access the values.

According to the Next.js documentation on upgrading to version 15, you need to await the params object before accessing its properties.

If you're using TypeScript, you'll also need to update your type definitions to reflect this change, as shown in the code example above.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: