Deploy Astro on Cloudflare with GitHub Actions

🚀 Astro 🟠 Cloudflare Pages & Workers ⚙️ GitHub Actions

Configuration Files

Production-ready configuration files with detailed comments and best practices. Each file works together as a complete deployment solution.
name: Deploy to Cloudflare Pages

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      deployments: write
    steps:
      - name: Checkout
        uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Build
        run: npm run build

      - name: Deploy to Cloudflare Pages
        uses: cloudflare/pages-action@v1
        with:
          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          projectName: your-project-name
          directory: dist
          gitHubToken: ${{ secrets.GITHUB_TOKEN }}

Prerequisites

  • Cloudflare account with Pages enabled
  • GitHub repository with admin access
  • Astro project initialized with @astrojs/cloudflare adapter
  • Node.js 18+ installed locally

Deployment Steps

  • Create a new GitHub repository for your Astro project
  • Add CLOUDFLARE_API_TOKEN and CLOUDFLARE_ACCOUNT_ID to GitHub Secrets
  • Create .github/workflows/deploy.yml with the above configuration
  • Push to main branch to trigger automatic deployment
  • Monitor deployment in GitHub Actions tab

Additional Notes

  • Zero egress fees with Cloudflare Pages
  • Automatic preview deployments for pull requests
  • Built-in SSL and global CDN