How to put an Astro site on Cloudflare Pages
These are the steps I follow for every new site. If you have not picked a framework yet, start with why I use Astro. The full picture is on how I build every website with Astro and Cloudflare.
Before you start
- An Astro site that builds on your computer with
npm run build. - The code in a GitHub repo.
- A Cloudflare account (the free plan is fine).
Step 1: Create the Pages project
In the Cloudflare dashboard, create a new Pages project and connect it to your GitHub repo. [ALI TO CONFIRM: the exact menu path you click through today (Cloudflare moves these around)]
Step 2: Set the build settings
| Setting | Value |
|---|---|
| Production branch | main |
| Build command | npm run build |
| Output folder | dist |
Pin the Node version so Cloudflare builds with the same version as your computer. I keep a .nvmrc file in the repo for that. [ALI TO CONFIRM: do you pin Node with .nvmrc, a NODE_VERSION variable, or both?]
Step 3: Turn off preview deployments
By default, Cloudflare builds a preview of every branch you push. Each one counts toward the free plan's 500 builds a month, and that limit is shared by all your projects. In September 2026 one of my sites used 416 of 452 builds in a month, so I turned preview deployments off on it and on many other repos.
In the project's build settings, set preview branches to none. [ALI TO CONFIRM: the exact name of this setting in the dashboard] Production still builds every time you merge to main.
Step 4: Merge to main and check the site
Merge to main. Cloudflare builds and publishes the site. Builds run one at a time on the free plan, so if another project is building, yours waits.
Step 5: Add your domain
Add your own domain to the Pages project. [ALI TO CONFIRM: how you add domains: is the domain's DNS already on Cloudflare when you do this?]
What went wrong for me
Leaving preview deployments on. It cost me nothing in money, but one site used 416 of 452 builds in a month, out of a limit that all my sites share. The details are in what the Cloudflare free plan really gives you. If you are moving from shared hosting or a VPS, see why I moved my sites from Hostinger to Cloudflare.
Questions people ask
What build command and output folder does Astro use on Cloudflare Pages?
The build command is npm run build and the output folder is dist. Those are Astro's defaults.
Should I turn off preview deployments?
If you have more than one site on the free plan, I would. Every preview build counts against the same 500 a month. I explain why in the build limits page.
Does my site still update if preview deployments are off?
Yes. Production still builds when you merge to main. You just do not get a separate preview link for every branch.
Do I need a paid Cloudflare plan for this?
No. I run my sites on the free plan.