diff --git a/src/runtime/plugin.ts b/src/runtime/plugin.ts index ad17d2c..0d47083 100644 --- a/src/runtime/plugin.ts +++ b/src/runtime/plugin.ts @@ -1,11 +1,12 @@ -import * as trpc from '@trpc/client' +import { createTRPCProxyClient, httpBatchLink } from '@trpc/client' +import type { TRPCClient } from '@trpc/client'; import { unref } from 'vue' import { FetchError } from 'ohmyfetch' import { useClientHeaders } from './client' import { defineNuxtPlugin, useRequestHeaders, useRuntimeConfig } from '#app' -import type { router } from '~/server/trpc' +// import type { router } from '~/server/trpc' -declare type AppRouter = typeof router +// declare type AppRouter = typeof router export default defineNuxtPlugin((nuxtApp) => { const config = useRuntimeConfig().public.trpc @@ -13,26 +14,30 @@ export default defineNuxtPlugin((nuxtApp) => { const otherHeaders = useClientHeaders() const baseURL = process.server ? '' : config.baseURL - const client = trpc.createTRPCClient({ - url: `${baseURL}${config.endpoint}`, - headers: () => { - return { - ...unref(otherHeaders), - ...headers, - } - }, - fetch: (input, options) => - globalThis.$fetch.raw(input.toString(), options) - .catch((e) => { - if (e instanceof FetchError && e.response) - return e.response + const client = createTRPCProxyClient({ + links: [ + httpBatchLink({ + url: `${baseURL}${config.endpoint}`, + headers: () => { + return { + ...unref(otherHeaders), + ...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), - })), + throw e + }) + .then(response => ({ + ...response, + json: () => Promise.resolve(response._data), + })), + }), + ], }) nuxtApp.provide('client', client) @@ -40,6 +45,6 @@ export default defineNuxtPlugin((nuxtApp) => { declare module '#app' { interface NuxtApp { - $client: trpc.TRPCClient + $client: TRPCClient } }