feat: add custom Nuxt client

This commit is contained in:
wobsoriano
2022-12-18 15:35:56 -08:00
parent d8d4c92ae8
commit ee85f3ccd1
9 changed files with 901 additions and 124 deletions

View File

@@ -1,23 +1,62 @@
import { createTRPCProxyClient, httpBatchLink, loggerLink } from '@trpc/client'
import superjson from 'superjson'
import { FetchError } from 'ofetch'
import { createTRPCNuxtClient } from 'trpc-nuxt/client'
import type { AppRouter } from '~~/server/trpc/routers'
export default defineNuxtPlugin(() => {
const headers = useRequestHeaders()
const client = createTRPCProxyClient<AppRouter>({
// const client = createTRPCProxyClient<AppRouter>({
// transformer: superjson,
// links: [
// // adds pretty logs to your console in development and logs errors in production
// loggerLink({
// enabled: opts =>
// process.env.NODE_ENV === 'development' ||
// (opts.direction === 'down' && opts.result instanceof Error)
// }),
// httpBatchLink({
// url: '/api/trpc',
// headers () {
// return headers
// },
// fetch: (input, options) =>
// globalThis.$fetch.raw(input.toString(), options)
// .catch((e) => {
// if (e instanceof FetchError && e.response) { return e.response }
// throw e
// })
// .then(response => ({
// ...response,
// json: () => Promise.resolve(response._data)
// }))
// })
// ]
// })
const client = createTRPCNuxtClient<AppRouter>({
transformer: superjson,
links: [
// adds pretty logs to your console in development and logs errors in production
loggerLink({
enabled: opts =>
process.env.NODE_ENV === 'development' ||
(opts.direction === 'down' && opts.result instanceof Error)
}),
// loggerLink({
// enabled: opts =>
// process.env.NODE_ENV === 'development' ||
// (opts.direction === 'down' && opts.result instanceof Error)
// }),
httpBatchLink({
url: 'http://localhost:3000/api/trpc',
url: '/api/trpc',
headers () {
return headers
}
},
fetch: (input, options) =>
$fetch.raw(input.toString(), options)
.catch((e) => {
if (e instanceof FetchError && e.response) { return e.response }
throw e
})
.then(response => ({
...response,
json: () => Promise.resolve(response._data)
}))
})
]
})