Hi Vercel Team,
I’m encountering a build failure when deploying my project on Vercel. The deployment log indicates that I’m importing next/headers in a file located in the lib/ directory, which is used in a page under the pages/ directory. This causes the following error:
Error: You're importing a component that needs "next/headers". That only works in a Server Component which is not supported in the pages/ directory../lib/supabase/server.tsimport { cookies } from "next/headers"Project details: • Repo: github.com/nicholas357/E-commerce-fullstack-2.0 • Framework: Next.js 15.2.4 • Package involved: /ssr for server-side Supabase client • I’m using pnpm@10.x • Deployment just doesn’t work.
I understand that next/headers is only compatible with the App Router, and I’m currently using the Pages Router.
Could you please guide me on: 1. The best practice to implement server-side Supabase authentication in this context? 2. Whether there’s a workaround (e.g. dynamic import or API route) that would be compatible with the pages/ directory? 3. If migrating to the App Router is required, what’s the minimal set of changes to fix this?
Any guidance would be appreciated. Thank you!