Deploying Next.js with Static Export on Cloudflare Pages

Why Static Export?

Next.js offers several deployment strategies, but static export (output: "export") is perfect for sites that don't need a server:

• Zero server cost — Static HTML served by CDN
• Maximum performance — no cold starts, no SSR delay
• Free Cloudflare Pages — 100k requests/day on free tier
• Simple deploy — next build generates the out/ folder, upload and done

Configuration

// next.config.ts
const nextConfig: NextConfig = {
  output: "export",
  trailingSlash: true,
  images: { unoptimized: true },
};

Limitations

With static export, you cannot use:

• Middleware
• API Routes
• Server Actions
• ISR (Incremental Static Regeneration)
• Optimized next/image (needs unoptimized: true)

Deploying to Cloudflare Pages

# Install wrangler
npm install -D wrangler

# Build + deploy
next build && npx wrangler pages deploy out \
  --project-name=my-site \
  --branch=main

Custom Domain

1. In the Cloudflare dashboard, go to Pages → your project → Custom domains
2. Add your domain
3. Set up a CNAME in DNS pointing to your-project.pages.dev

That's it. In less than 5 minutes, your Next.js site is live with a global CDN, automatic SSL and zero cost.