与 Nuxt 集成

我们可以使用 Nuxt 的社区插件 nuxt-elysia，利用 Eden Treaty 在 Nuxt API 路由上配置 Elysia。

1. 通过以下命令安装插件：

bun add elysia @elysiajs/eden
bun add -d nuxt-elysia

2. 在你的 Nuxt 配置中添加 nuxt-elysia：

export default defineNuxtConfig({
    modules: [ 
        'nuxt-elysia'
    ], 
    nitro: { 
        preset: 'Bun'
    } 
})

TIP

nitro.preset: 'Bun' 配置是必需的，因为 Elysia 运行在 Bun 运行时。这告诉 Nuxt 的 Nitro 使用 Bun 作为服务器运行时，而非默认的 Node.js 运行时。

3. 在项目根目录创建 api.ts：

export default () => new Elysia() 
  .get('/hello', () => ({ message: 'Hello world!' })) 

4. 在你的 Nuxt 应用中使用 Eden Treaty：

<template>
    <div>
        <p>{{ data.message }}</p>
    </div>
</template>
<script setup lang="ts">
const { $api } = useNuxtApp()

const { data } = await useAsyncData(async () => {
    const { data, error } = await $api.hello.get()

    if (error)
        throw new Error('调用 API 失败')

    return data
})
</script>

这将自动在 Nuxt API 路由上配置并运行 Elysia。

pnpm

如果你使用 pnpm，pnpm 默认不自动安装 peer 依赖，你需要手动安装额外依赖。

pnpm add @sinclair/typebox openapi-types

前缀

默认情况下，Elysia 将挂载在 /_api，但我们可以通过 nuxt-elysia 配置进行自定义。

export default defineNuxtConfig({
	nuxtElysia: {
		path: '/api'
	}
})

这会将 Elysia 挂载到 /api，而非 /_api。

更多配置请参考 nuxt-elysia