与 Nuxt 集成

我们可以使用 nuxt-elysia（一个 Nuxt 社区插件）在 Nuxt API 路由上设置 Elysia 并配置 Eden Treaty。

1. 使用以下命令安装插件：

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

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

export default defineNuxtConfig({
    modules: [ 
        'nuxt-elysia'
    ] 
})

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('Failed to call API')

    return data
})
</script>

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

前缀

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

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

这将把 Elysia 挂载到 /api 而不是 /_api。

有关更多配置，请参考 nuxt-elysia。