Next, in the Cloudflare Dashboard, create a new Pages project:
- Navigate to the project creation pages (Your account Home > Workers & Pages > Create application > Pages > Connect to Git).
- Select the GitHub/GitLab repository you pushed your code to.
- Choose a project name and your production branch.
- Select Next.js as the Framework preset and provide the following options:
Option Value Build command pnpm dlx @cloudflare/next-on-pages@1
Build output directory .vercel/output/static
- In the Environment variables (advanced) section, add a new variable named
NODE_VERSION
set to20
or greater, add new variables namedNEXT_PUBLIC_GRAPHQL_URI
andNEXT_PUBLIC_API_URL
. - Click on Save and Deploy to start the deployment (this first deployment won't be fully functional as the next step is also necessary).
- Go to the Pages project settings page (Settings > Functions > Compatibility Flags), add the
nodejs_compat
flag for both production and preview, and make sure that the Compatibility Date for both production and preview is set to at least2022-11-30
.