trpc-nuxt: Cannot stringify arbitrary non-POJOs TRPCClientError
I always get this error: Cannot stringify arbitrary non-POJOs TRPCClientError
Here are my files:
~/server/api/trpc/index.ts
import type { inferAsyncReturnType } from '@trpc/server'
import * as trpc from '@trpc/server'
import * as z from 'zod'
import type { OnErrorPayload } from 'trpc-nuxt/api'
import * as PrismaPkg from '@prisma/client'
const {PrismaClient} = PrismaPkg
const client = new PrismaClient()
export const router = trpc.router()
// queries and mutations...
.query('hello',{
// validate input with Zod
async resolve(req) {
console.log(req)
// use your ORM of choice
return {
message: `Hello`
}
},
})
~/pages/index.vue
<script setup lang="ts">
import MyButton from '@/components/MyButton.vue'
import {useAsyncQuery, useFetch} from "#imports";
const router = useRouter()
const {data} = await useAsyncQuery(["hello"]);
</script>
<template>
<NuxtLayout name="home">
<section class="flex flex-col h-max justify-center">
<div class="bg-primary-600 rounded-lg p-10 text-white text-2xl" >{{data}}</div>
[...]
</section>
<NuxtLayout name="home">
</template>
Looking at the error message, seems to be that my trpc endpoint is refusing connections.
TRPCClientError: request to http://localhost:3000/trpc/hello?batch=1&input=%7B%7D failed, reason: connect ECONNREFUSED ::1:3000
at Function.from (file:///Users/jean-emrickrioux/Dev/stakeFrites/_tools/trakmos-project/trakmos-nuxt/.nuxt/dist/server/server.mjs:33400:14)
at file:///Users/jean-emrickrioux/Dev/stakeFrites/_tools/trakmos-project/trakmos-nuxt/.nuxt/dist/server/server.mjs:34021:42
at processTicksAndRejections (node:internal/process/task_queues:96:5) {
originalError: FetchError: request to http://localhost:3000/trpc/hello?batch=1&input=%7B%7D failed, reason: connect ECONNREFUSED ::1:3000
at ClientRequest.<anonymous> (file:///Users/jean-emrickrioux/Dev/stakeFrites/_tools/trakmos-project/trakmos-nuxt/node_modules/node-fetch/src/index.js:108:11)
at ClientRequest.emit (node:events:527:28)
at Socket.socketErrorListener (node:_http_client:454:9)
at Socket.emit (node:events:527:28)
at emitErrorNT (node:internal/streams/destroy:164:8)
at emitErrorCloseNT (node:internal/streams/destroy:129:3)
at processTicksAndRejections (node:internal/process/task_queues:83:21)
Second try:
Changed the trpc directory to ~/server/api/trpc
[nuxt] [request error] Invalid lazy handler result. It should be a function:
at ./node_modules/h3/dist/index.mjs:299:17
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async ./node_modules/h3/dist/index.mjs:420:19
at async Server.nodeHandler (./node_modules/h3/dist/index.mjs:370:7)
My changed nuxt.config.ts
looks like this:
export default defineNuxtConfig({
trpc: {
baseURL: 'http://localhost:3000/api', // defaults to http://localhost:3000
endpoint: '/trpc', // defaults to /trpc
},
}
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Comments: 17 (9 by maintainers)
Thank you for reporting!
I’ll take a look at this asap. Thanks for reporting!