Astro is a modern static site builder. This guide walks you through deploying Astro sites to Layer0.

If you don't have an existing Astro site, you can create one by running:

# Make a new project directory, and navigate directly into it
$ mkdir my-astro-project && cd $_

# prepare for liftoff...
$ npm init astro

# install dependencies
$ npm install

# start developing!
$ npm run dev

# when you're ready: build your static site to `dist/`
$ npm run build

# First, globally install the Layer0 CLI:
$ npm i -g @layer0/cli

# Then, add Layer0 to your Astro site:
$ 0 init

Paste the following into routes.ts:

// routes.ts
import { Router } from '@layer0/core'

export default new Router()
  .get('/:path*/:file.:ext(js|css|png|ico|jpg|gif|svg)', ({ cache, serveStatic }) => {
    cache({
      browser: {
        // cache js, css, and images in the browser for one hour...
        maxAgeSeconds: 60 * 60,
      },
      edge: {
        // ... and at the edge for one year
        maxAgeSeconds: 60 * 60 * 24 * 365,
      },
    })
    serveStatic('dist/:path*/:file.:ext')
  })
  .match('/:path*', ({ cache, serveStatic, setResponseHeader }) => {
    cache({
      // prevent the browser from caching html...
      browser: false,
      edge: {
        // ...cache html at the edge for one year
        maxAgeSeconds: 60 * 60 * 24 * 365,
      },
    })
    setResponseHeader('content-type', 'text/html; charset=UTF-8')
    serveStatic('dist/:path*')
  })

You can remove the origin backend from layer0.config.js:

module.exports = {}

To deploy your site to Layer0, run:

# Create a production build of your astro site
$ npm run build

# Deploy it to Layer0
$ 0 deploy
Edit this guide on GitHub