In the documentation
Deployment
Explainer uses Playwrite to generate diagrams written with Mermaid.
Your environment must support installing Playwrite and its browsers in order for Explainer to generate all your pages.
Cloudflare Pages
Explainer provides a GitHub Actions workflow to deploy your static site to a Cloudflare Pages environment.
Note
Cloudflare does not allow the installation of Playwright or its browsers. You must use an external CI/CD pipeline to generate the diagrams and then push them to your Cloudflare Pages environment.
name: Astro CI/CD with Playwright & Cloudflare Pages
on:
push:
branches: [main]
pull_request:
branches: [main]
permissions:
contents: read
deployments: write
jobs:
test-and-deploy:
runs-on: ubuntu-latest
env:
NODE_VERSION: 20
steps:
- uses: actions/checkout@v4
- uses: pnpm/action-setup@v4
with:
version: 9
run_install: false
- name: Setup Node.JS
uses: actions/setup-node@v3
with:
node-version: 20.14.0
- name: 📦 Install dependencies
run: pnpm install
- name: 🎭 Install Playwright browsers
run: pnpm exec playwright install --with-deps
- name: 🛠️ Build Astro
run: pnpm run build
- name: 🚀 Deploy to Cloudflare Pages
uses: cloudflare/pages-action@v1
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
projectName: ${{ secrets.CLOUDFLARE_PROJECT_NAME }}
directory: ./dist
gitHubToken: ${{ secrets.GITHUB_TOKEN }}