Error: Route used `params.slug`. `params` should be awaited before using its properties

What causes this error

Starting with Next.js 15, the App Router made params and searchParams asynchronous in Server Components, layouts, and generateMetadata. This was done to support future rendering optimizations, but it breaks any code still treating them as plain synchronous objects.

The Fix

Type params as a Promise and await it before use:

// Before (Next.js 14 and earlier)
interface Props {
  params: { slug: string };
}
export default function Page({ params }: Props) {
  return <h1>{params.slug}</h1>;
}

// After (Next.js 15+)
interface Props {
  params: Promise<{ slug: string }>;
}
export default async function Page({ params }: Props) {
  const { slug } = await params;
  return <h1>{slug}</h1>;
}

The same applies to searchParams and to generateMetadata's function signature.

Common causes / variations

• Copy-pasting page components from pre-v15 tutorials or your own older projects
• Destructuring params directly in the function signature without awaiting first
• Forgetting to also update generateMetadata, which takes the same async params shape

Related errors

See also: hydration mismatch errors, and the CORS error article if this page also calls an external API.