2021-10-11 16:35:02 +00:00
---
icon: LogoCloudFlare
---
2021-06-14 12:31:30 +00:00
# Cloudflare Workers
2021-10-11 16:35:02 +00:00
How to deploy Nuxt to Cloudflare Workers.
2021-06-14 12:31:30 +00:00
2021-10-11 16:35:02 +00:00
::list
2021-10-29 11:26:01 +00:00
2021-10-11 17:18:38 +00:00
- Support for Workers build output
- Zero millisecond cold start with edge-side rendering
2021-10-11 16:35:02 +00:00
- Minimal configuration required
::
2021-06-14 12:31:30 +00:00
## Setup
Login to your [Cloudflare Workers ](https://workers.cloudflare.com ) account and obtain your `account_id` from the sidebar.
Create a `wrangler.toml` in your root directory:
```ini{}[wrangler.toml]
name = "playground"
type = "javascript"
account_id = "< the account_id you obtained > "
workers_dev = true
route = ""
zone_id = ""
[site]
bucket = ".output/public"
entry-point = ".output"
2021-10-12 20:07:54 +00:00
[build]
command = "NITRO_PRESET=cloudflare yarn nuxt build"
upload.format = "service-worker"
2021-06-14 12:31:30 +00:00
```
2021-09-28 11:30:54 +00:00
## Testing locally
You can use [miniflare ](https://miniflare.dev/ ), a local Cloudflare Workers development server, to test your app locally:
```bash
NITRO_PRESET=cloudflare yarn build
npx miniflare .output/server/index.mjs --site .output/public
```
2021-06-14 12:31:30 +00:00
## Deploy from your local machine using wrangler
Install [wrangler ](https://github.com/cloudflare/wrangler ) and login to your Cloudflare account:
```bash
npm i @cloudflare/wrangler -g
wrangler login
```
Generate website with `cloudflare` preset:
```bash
NITRO_PRESET=cloudflare yarn build
```
You can preview locally:
```bash
wrangler dev
```
Publish:
```bash
wrangler publish
```
## Deploy within CI/CD using Github Actions
Create a token according to [the wrangler action docs ](https://github.com/marketplace/actions/deploy-to-cloudflare-workers-with-wrangler#authentication ) and set `CF_API_TOKEN` in your repository config on GitHub.
Create `.github/workflows/cloudflare.yml` :
```yml{}[.github/workflows/cloudflare.yml]
name: cloudflare
on:
push:
branches:
- main
pull_request:
branches:
- main
jobs:
ci:
runs-on: ${{ matrix.os }}
strategy:
matrix:
os: [ ubuntu-latest ]
node: [ 14 ]
steps:
- uses: actions/setup-node@v1
with:
node-version: ${{ matrix.node }}
- name: Checkout
uses: actions/checkout@master
- name: Cache node_modules
uses: actions/cache@v2
with:
path: node_modules
key: ${{ matrix.os }}-node-v${{ matrix.node }}-deps-${{ hashFiles(format('{0}{1}', github.workspace, '/yarn.lock')) }}
- name: Install Dependencies
if: steps.cache.outputs.cache-hit != 'true'
run: yarn
- name: Build
run: yarn build
env:
NITRO_PRESET: cloudflare
- name: Publish to Cloudflare
uses: cloudflare/wrangler-action@1.3.0
with:
apiToken: ${{ secrets.CF_API_TOKEN }}
```
## More information
2021-10-12 14:31:47 +00:00
See [more information on the service worker preset ](/docs/deployment/presets/service-worker ) for full details.
2021-06-14 12:31:30 +00:00
## Demo
2021-11-21 12:31:44 +00:00
A live demo is available on < https: / / nitro-demo . nuxt . workers . dev / > .