Cloudflare Pages Setup

Cloudflare Pages Setup Guide

Cloudflare Pages hosts your Quartz site with automatic deployments from GitHub.

Related: Quartz | Takopi | Secrets

Setup via Dashboard

1. Go to Cloudflare Dashboard
2. Select Pages → Create a project
3. Connect your GitHub account
4. Select your Quartz repository
5. Configure build settings:
   • Production branch: v4 (or your main branch)
   • Build command: npx quartz build
   • Build output directory: public
6. Add environment variable:
   • NODE_VERSION = 22
7. Click Save and Deploy

Custom Domain

1. In Pages project → Custom domains
2. Add your domain (e.g., yourdomain.com)
3. Follow DNS instructions to add CNAME record

CLI Deployment (Alternative)

Create API Token

1. Go to API Tokens
2. Create token with permissions:
   • Account > Cloudflare Pages > Edit
   • Account > Account Settings > Read
   • User > User Details > Read
3. Save token securely

Deploy via CLI

# Set token
export CLOUDFLARE_API_TOKEN="your-token-here"
 
# Build and deploy
cd /path/to/quartz
npx quartz build
npx wrangler pages deploy public --project-name=your-project-name

Useful CLI Commands

# List projects
npx wrangler pages project list
 
# List deployments
npx wrangler pages deployment list --project-name=your-project
 
# Create new project
npx wrangler pages project create your-project-name

Automatic Deployments

With GitHub integration, Cloudflare automatically deploys on every push to your production branch.

Workflow:

1. Make changes to content
2. Run npx quartz sync (commits and pushes)
3. Cloudflare detects push and rebuilds
4. Site is live in ~1-2 minutes

Troubleshooting

Build fails with Node version error

• Add NODE_VERSION=22 in environment variables

404 on homepage

• Ensure content/index.md exists
• Check build output includes index.html

Changes not appearing

• Check deployment status in dashboard
• May take 1-2 minutes for propagation
• Try hard refresh (Ctrl+Shift+R)