/pages-action

🛑 DEPRECATED, please use wrangler-action

Primary LanguageJavaScriptMIT LicenseMIT

[DEPRECATED] Cloudflare Pages GitHub Action

No Maintenance Intended

Important

pages-action has been deprecated with the latest release being v1.5.0. We encourage you to migrate to wrangler-action, which supports Pages deployments and offers a unified tool for managing both Workers and Pages. Here are a few important things to keep in mind as you make the migration:

  • The YAML syntax for wrangler-action is different from pages-action. Please refer to the Pages deployment setup instructions for details.
  • wrangler-action currently does not provide the same outputs as pages-action for Pages project deployments. If your workflows depend on these outputs, you may need to make temporary adjustments. Rest assured, we’re working to bring these outputs to wrangler-action soon. You can track our progress in this issue.
  • The "Deployment" feature available in pages-action, which lets you view a list of past deployments, is not yet available in wrangler-action, but we plan to add this in a future release of wrangler-action. You can track our progress in this issue.

We sincerely thank you for your support and contributions to pages-action over the years. The repository will remain open and archived.

If you have any questions or issues, please open an issue under wrangler-action or reach out to us directly on the Cloudflare Developers Discord.

GitHub Action for creating Cloudflare Pages deployments, using the new Direct Upload feature and Wrangler integration.

Usage

  1. Create an API token in the Cloudflare dashboard with the "Cloudflare Pages — Edit" permission.

  2. Add that API token as a secret to your GitHub repository, CLOUDFLARE_API_TOKEN.

  3. Create a .github/workflows/publish.yml file in your repository:

    on: [push]
    
    jobs:
      publish:
        runs-on: ubuntu-latest
        permissions:
          contents: read
          deployments: write
        name: Publish to Cloudflare Pages
        steps:
          - name: Checkout
            uses: actions/checkout@v3
    
          # Run a build step here if your project requires
    
          - name: Publish to Cloudflare Pages
            uses: cloudflare/pages-action@v1
            with:
              apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
              accountId: YOUR_ACCOUNT_ID
              projectName: YOUR_PROJECT_NAME
              directory: YOUR_BUILD_OUTPUT_DIRECTORY
              # Optional: Enable this if you want to have GitHub Deployments triggered
              gitHubToken: ${{ secrets.GITHUB_TOKEN }}
              # Optional: Switch what branch you are publishing to.
              # By default this will be the branch which triggered this workflow
              branch: main
              # Optional: Change the working directory
              workingDirectory: my-site
              # Optional: Change the Wrangler version, allows you to point to a specific version or a tag such as `beta`
              wranglerVersion: '3'
  4. Replace YOUR_ACCOUNT_ID, YOUR_PROJECT_NAME and YOUR_BUILD_OUTPUT_DIRECTORY with the appropriate values to your Pages project.

Get account ID

To find your account ID, log in to the Cloudflare dashboard > select your zone in Account Home > find your account ID in Overview under API on the right-side menu. If you have not added a zone, add one by selecting Add site . You can purchase a domain from Cloudflare’s registrar.

If you do not have a zone registered to your account, you can also get your account ID from the pages.dev URL. E.g: https://dash.cloudflare.com/<ACCOUNT_ID>/pages

Generate an API Token

To generate an API token:

  1. Log in to the Cloudflare dashboard.
  2. Select My Profile from the dropdown menu of your user icon on the top right of your dashboard.
  3. Select API Tokens > Create Token.
  4. Under Custom Token, select Get started.
  5. Name your API Token in the Token name field.
  6. Under Permissions, select Account, Cloudflare Pages and Edit:
  7. Select Continue to summary > Create Token.

More information can be found on our guide for making Direct Upload deployments with continous integration.

Specifying a branch

The branch name is used by Cloudflare Pages to determine if the deployment is production or preview. Read more about git branch build controls.

If you are in a Git workspace, Wrangler will automatically pull the branch information for you. You can override this manually by adding the argument branch: YOUR_BRANCH_NAME.

Specifying a working directory

By default Wrangler will run in the root package directory. If your app lives in a monorepo and you want to run Wrangler from its directory, add workingDirectory: YOUR_PACKAGE_DIRECTORY.

Wrangler v3

You can use the newly released Wrangler v3 with the wranglerVersion property.

  - name: Publish to Cloudflare Pages
    uses: cloudflare/pages-action@v1
    with:
      apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
      accountId: YOUR_ACCOUNT_ID
      projectName: YOUR_PROJECT_NAME
      directory: YOUR_BUILD_OUTPUT_DIRECTORY
      # Enable Wrangler v3
      wranglerVersion: '3'

Outputs

Name Description
id The ID of the pages deployment
url The URL of the pages deployment
alias The alias if it exists otherwise the deployment URL
environment The environment that was deployed to