Streaming Not Working When Deploying on Vercel (Next.js App Router)

Issue

I'm using the Next.js App Router. Streaming with the AI SDK works in my local development environment. However, when deploying to Vercel, streaming does not work in the deployed app. Instead of streaming, only the full response is returned after a while.

Cause

The route was inferred as a static route and has been compiled as such.

Solution

You need to explicitly enforce dynamic behavior for the route.

Add the following to your route file:

export const dynamic = 'force-dynamic';

This will enforce dynamic behavior, which is required for streaming.

Note: When deploying on Vercel you may also need the following workaround:

import { unstable_noStore as noStore } from 'next/cache';

export default async function Component() {
  noStore();
  const result = await generateText({...})
  ...
}