Skip to content
Our Sponsors
Open in Anthropic

title: 与 Astro 集成 - ElysiaJS head: - - meta - property: 'og:title' content: 与 Astro 集成 - ElysiaJS

- - meta
  - name: 'description'
    content: 您可以在 Astro 上运行 Elysia。由于符合 WinterCG 标准,Elysia 将如预期般正常工作。

- - meta
  - property: 'og:description'
    content: 您可以在 Astro 上运行 Elysia。由于符合 WinterCG 标准,Elysia 将如预期般正常工作。

与 Astro 集成

通过 Astro 端点,我们可以直接在 Astro 上运行 Elysia。

  1. astro.config.mjs 中将 output 设置为 server
javascript
// astro.config.mjs
import { defineConfig } from 'astro/config'

// https://astro.build/config
export default defineConfig({
    output: 'server'
})
  1. 创建 pages/[...slugs].ts
  2. [...slugs].ts 中创建或导入一个现有的 Elysia 服务器
  3. 使用您想要暴露的方法名导出处理程序
typescript
// pages/[...slugs].ts
import { Elysia, t } from 'elysia'

const app = new Elysia()
    .get('/api', () => 'hi')
    .post('/api', ({ body }) => body, {
        body: t.Object({
            name: t.String()
        })
    })

const handle = ({ request }: { request: Request }) => app.handle(request) 

export const GET = handle 
export const POST = handle 

由于符合 WinterCG 标准,Elysia 将如预期般正常工作。

我们建议在 Bun 上运行 Astro,因为 Elysia 是为在 Bun 上运行而设计的。

TIP

得益于 WinterCG 的支持,您可以在不于 Bun 上运行 Astro 的情况下运行 Elysia 服务器。

通过这种方法,您可以将前端和后端共同部署在单个仓库中,并通过 Eden 实现端到端的类型安全。

请参考 Astro 端点 以获取更多信息。

前缀

如果您将 Elysia 服务器放置在应用路由器的根目录之外,则需要为 Elysia 服务器指定前缀。

例如,如果您将 Elysia 服务器放置在 pages/api/[...slugs].ts 中,则需要为 Elysia 服务器指定前缀为 /api

typescript
// pages/api/[...slugs].ts
import { Elysia, t } from 'elysia'

const app = new Elysia({ prefix: '/api' }) 
    .get('/', () => 'hi')
    .post('/', ({ body }) => body, {
        body: t.Object({
            name: t.String()
        })
    })

const handle = ({ request }: { request: Request }) => app.handle(request) 

export const GET = handle 
export const POST = handle 

这将确保无论您将 Elysia 放置在哪个位置,其路由都能正常工作。