.github | ||
.husky | ||
example | ||
src | ||
.editorconfig | ||
.git-blame-ignore-revs | ||
.gitignore | ||
.prettierrc | ||
action.yml | ||
index.js | ||
LICENSE | ||
package-lock.json | ||
package.json | ||
README.md |
Cloudflare Pages GitHub Action
GitHub Action for creating Cloudflare Pages deployments, using the new Direct Upload feature and Wrangler integration.
Usage
-
Create an API token in the Cloudflare dashboard with the "Cloudflare Pages — Edit" permission.
-
Add that API token as a secret to your GitHub repository,
CLOUDFLARE_API_TOKEN
. -
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'
-
Replace
YOUR_ACCOUNT_ID
,YOUR_PROJECT_NAME
andYOUR_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:
- Log in to the Cloudflare dashboard.
- Select My Profile from the dropdown menu of your user icon on the top right of your dashboard.
- Select API Tokens > Create Token.
- Under Custom Token, select Get started.
- Name your API Token in the Token name field.
- Under Permissions, select Account, Cloudflare Pages and Edit:
- 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 |