title | description | type | i18nReady |
---|---|---|---|
Deploy your Astro Site to Deno |
How to deploy your Astro site to the web using Deno. |
deploy |
true |
import ReadMore from '~/components/ReadMore.astro'; import { Steps } from '@astrojs/starlight/components';
You can deploy a server-side rendered Astro site to Deno Deploy, a distributed system that runs JavaScript, TypeScript, and WebAssembly at the edge, worldwide.
This guide includes instructions for deploying to Deno Deploy through GitHub Actions or Deno Deploy's CLI.
This guide assumes you already have Deno installed.
This page provides instructions for deploying your Astro project to Deno Deploy as a server-side rendered site (SSR).
To deploy a static site, see the Deno deploy static site tutorial.
To enable SSR in your Astro project and deploy on Deno Deploy:
Add the Deno adapter to enable SSR in your Astro project with the following astro add
command. This will install the adapter and make the appropriate changes to your astro.config.mjs
file in one step.
npx astro add deno
If you prefer to install the adapter manually instead, complete the following two steps:
1. Install [the `@astrojs/deno` adapter][Deno adapter] to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal:```bash
npm install @astrojs/deno
```
-
Update your
astro.config.mjs
project configuration file with the changes below.// astro.config.mjs import { defineConfig } from 'astro/config'; import deno from '@astrojs/deno'; export default defineConfig({ output: 'server', adapter: deno(), });
Next, Update your
preview
script inpackage.json
with the change below.// package.json { // ... "scripts": { "dev": "astro dev", "start": "astro dev", "build": "astro build", "preview": "astro preview" "preview": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs" } }
You can now use this command to preview your production Astro site locally with Deno.
npm run preview
You can deploy to Deno Deploy through GitHub Actions or using Deno Deploy’s CLI (command line interface).
If your project is stored on GitHub, the Deno Deploy website will guide you through setting up GitHub Actions to deploy your Astro site.
1. Push your code to a public or private GitHub repository.-
Sign in on Deno Deploy with your GitHub account, and click on New Project.
-
Select your repository, the branch you want to deploy from, and select GitHub Action mode. (Your Astro site requires a build step, and cannot use Automatic mode.)
-
In your Astro project, create a new file at
.github/workflows/deploy.yml
and paste in the YAML below. This is similar to the YAML given by Deno Deploy, with the additional steps needed for your Astro site.name: Deploy on: [push] jobs: deploy: name: Deploy runs-on: ubuntu-latest permissions: id-token: write # Needed for auth with Deno Deploy contents: read # Needed to clone the repository steps: - name: Clone repository uses: actions/checkout@v4 # Not using npm? Change `npm ci` to `yarn install` or `pnpm i` - name: Install dependencies run: npm ci # Not using npm? Change `npm run build` to `yarn build` or `pnpm run build` - name: Build Astro run: npm run build - name: Upload to Deno Deploy uses: denoland/deployctl@v1 with: project: my-deno-project # TODO: replace with Deno Deploy project name entrypoint: server/entry.mjs root: dist
-
After committing this YAML file, and pushing to GitHub on your configured deploy branch, the deploy should begin automatically!
You can track the progress using the "Actions" tab on your GitHub repository page, or on Deno Deploy.
```bash
deno install --allow-read --allow-write --allow-env --allow-net --allow-run --no-check -r -f https://deno.land/x/deploy/deployctl.ts
```
-
Run your Astro build step.
npm run build
-
Run
deployctl
to deploy!In the command below, replace
<ACCESS-TOKEN>
with your Personal Access Token and<MY-DENO-PROJECT>
with your Deno Deploy project name.DENO_DEPLOY_TOKEN=<ACCESS-TOKEN> deployctl deploy --project=<MY-DENO-PROJECT> --no-static --include=./dist ./dist/server/entry.mjs
You can track all your deploys on Deno Deploy.
-
(Optional) To simplify the build and deploy into one command, add a
deploy-deno
script inpackage.json
.// package.json { // ... "scripts": { "dev": "astro dev", "start": "astro dev", "build": "astro build", "preview": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs", "deno-deploy": "npm run build && deployctl deploy --project=<MY-DENO-PROJECT> --no-static --include=./dist ./dist/server/entry.mjs" } }
Then you can use this command to build and deploy your Astro site in one step.
DENO_DEPLOY_TOKEN=<ACCESS-TOKEN> npm run deno-deploy
Read more about SSR in Astro.