Astro
Documentation
Quickstart
Installation
npm create --yes astro@latestnpm install bunny-astro
Configuration
Update your config to use the bunny-astro
adapter and set the output to server
:
// @ts-checkimport { defineConfig } from 'astro/config'import bunny from 'bunny-astro'import mdx from '@astrojs/mdx'import sitemap from '@astrojs/sitemap'// https://astro.build/configexport default defineConfig({ site: 'https://example.com', output: 'server', adapter: bunny({ imageService: 'bunny', }), integrations: [mdx(), sitemap()],})
Also, update your site metadata in astro.config.mjs
(e.g. site
).
Bunny Optimizer is currently incompatible with Edge Scripting.
Enabling Bunny Optimizer costs $9.5/mo per website. Each stage counts as a separate website.
There are four image service options:
bunny
: Uses the Bunny Optimizer service.passthrough
: Uses the existing noop service.compile
: Uses Astro’s default service (sharp), but only on pre-rendered routes at build time. During SSR for pages rendered on-demand, allastro:assets
features are disabled.custom
: Always uses the image service configured in Image Options. This option will not check to see whether the configured image service works in edge scripting runtime.
The adapter will default to compile mode when an incompatible image service is configured. Otherwise, it will use the globally configured image service. Unfortunately, due to a bug in Astro core, you will receive warnings locally about the image service.
If you are are using the blog
template, please remove all usage of getStaticPaths()
:
src/pages/blog/[...slug].astro
---import { type CollectionEntry, getCollection } from 'astro:content'import BlogPost from '../../layouts/BlogPost.astro'export async function getStaticPaths() { const posts = await getCollection('blog'); return posts.map((post) => ({ params: { slug: post.slug }, props: post, }));}const posts = await getCollection('blog') type Props = CollectionEntry<'blog'>const post = Astro.props const { slug } = Astro.paramsconst post = posts.find((page) => page.slug === slug)if (!post) return Astro.redirect('/404')const { Content } = await post.render()---<BlogPost {...post.data}> <h1>{post.data.title}</h1> <Content /></BlogPost>
All features, such as Static File Endpoints, Middleware, and Content Collections, are supported too.
Configuration with Static Site Generation (SSG)
This adapter was made specifically for server-side rendering (SSR). For SSG, follow these instructions instead.
Deployment
Build
npm run build
Deploy
npx --yes bunny-launcher@latest --interactive