Edgio

Astro

Astro is a modern static site builder. This guide walks you through deploying Astro sites to Edgio.
Astro 2.x is supported in all versions of Edgio v7.
Astro 3.x requires Edgio v7.4.0 or later which introduces Node.js 18 support.

Example SSR Site

This Astro example app uses server-side rendering.

Prerequisites

Setup requires:

Install the Edgio CLI

If you have not already done so, install the Edgio CLI.
Bash
1npm i -g @edgio/cli@latest

Create your Astro site

If you don’t have an existing Astro site, you can create one by running:
Bash
1npx astro build
Recent versions of Astro require Node.js >=18.14.1. You may need to update your edgio.config.js file to specify Node.js 18 as the cloud runtime.

Initializing your Project

Initialize your project for use with Edgio by running the following command in your project’s root directory:
Bash
1edgio init --edgioVersion latest
This will automatically add all of the required dependencies and files to your project. These include:
  • The @edgio/core package
  • The @edgio/cli package
  • The @edgio/connectors package
  • edgio.config.js - Contains various configuration options for Edgio.
  • routes.js - A default routes file that sends all requests to the Astro. Update this file to add caching or proxy some URLs to a different origin.

Routing

The default routes.js file created by edgio init sends all requests to Astro server via a fallback route.
JavaScript
1// This file was added by edgio init.
2// You should commit this file to source control.
3
4const {Router} = require('@edgio/core/router');
5const {connectorRoutes} = require('@edgio/connectors');
6
7export default new Router().use(connectorRoutes);

Enable Server Side Rendering

To enable server side rendering, the following steps are required:
  • Specify appPath inside edgio.config.js.
  • Configure server.host inside astro.config.mjs.

Specify appPath inside edgio.config.js

After you’ve setup @astrojs/node with Astro, specify the server file path in edgio.config.js as shown below:
JavaScriptedgio.config.js
1const {join} = require('path');
2
3module.exports = {
4 astro: {
5 appPath: join(process.cwd(), 'dist', 'server', 'entry.mjs'),
6 },
7 // Rest of the config
8};

Configure server.host inside astro.config.mjs

Update astro.config.mjs to configure server.host as shown below:
JavaScriptastro.config.mjs
1import {defineConfig} from 'astro/config';
2
3import node from '@astrojs/node';
4
5// https://astro.build/config
6export default defineConfig({
7 output: 'server',
8 adapter: node({
9 mode: 'standalone',
10 }),
11 server: {
12 host: '0.0.0.0',
13 },
14});
This allows the server to listen on all network IP addresses. See server.host in Astro documentation for more information. If the host is not properly configured, your applications may not be accessible as indicated by an ECONNREFUSED error:
Bash
1"error":"Error: connect ECONNREFUSED 127.0.0.1:3001"
If you’re using custom server file for enabling server side rendering, make sure your server is listening to port via process.env['PORT'].

Running Locally

To test your app locally, run:
Bash
1edgio dev
You can do a production build of your app and test it locally using:
Bash
1edgio build && edgio run --production
Setting --production runs your app exactly as it will be when deployed to the Edgio cloud.

Deploy to Edgio

Deploy your app to the Sites by running the following commands in your project’s root directory:
Bash
1edgio deploy
Your initial CDN-as-code deployment will generate system-defined origin configurations along with those defined within your edgio.config.js. Learn more about system-defined origins.
See Deployments for more information.