tRPC•3mo ago

Is it possible to use trpc client in a shared monorepo package?

My pnpm monorepo setup:

API (express)
packages/shared (shared code)
web (nextjs)
app (react native)

right now my web uses trpc + react query for api calls. I want to add the same functinoality to the app, but dont want to have to repeat all of my react query hooks
ex.

export function useGetCurrentUser() {
  const { firebaseUser } = useFirebaseAuthStore();
  const trpc = useTRPC();

  const baseOptions = trpc.auth.getCurrentUser.queryOptions();

  return useQuery({
    ...baseOptions,
    ...getDefaultAuthQueryOptions(),
    enabled: !!firebaseUser && !!firebaseUser.emailVerified
  });
}

export function useGetCurrentUser() {
  const { firebaseUser } = useFirebaseAuthStore();
  const trpc = useTRPC();

  const baseOptions = trpc.auth.getCurrentUser.queryOptions();

  return useQuery({
    ...baseOptions,
    ...getDefaultAuthQueryOptions(),
    enabled: !!firebaseUser && !!firebaseUser.emailVerified
  });
}

export function useGetCurrentUser() {
  const { firebaseUser } = useFirebaseAuthStore();
  const trpc = useTRPC();

  const baseOptions = trpc.auth.getCurrentUser.queryOptions();

  return useQuery({
    ...baseOptions,
    ...getDefaultAuthQueryOptions(),
    enabled: !!firebaseUser && !!firebaseUser.emailVerified
  });
}

export function useGetCurrentUser() {
  const { firebaseUser } = useFirebaseAuthStore();
  const trpc = useTRPC();

  const baseOptions = trpc.auth.getCurrentUser.queryOptions();

  return useQuery({
    ...baseOptions,
    ...getDefaultAuthQueryOptions(),
    enabled: !!firebaseUser && !!firebaseUser.emailVerified
  });
}

I currently have to repeat this function in both web and mobile.

I wanted to move my trpc hooks to the shared package, but I keep getting error

export const context = createTRPCContext<AppRouter>();

export const context = createTRPCContext<AppRouter>();

export const context = createTRPCContext<AppRouter>();

export const context = createTRPCContext<AppRouter>();

The inferred type of 'context' cannot be named without a reference to '../../../../API/node_modules/@trpc/server/dist/unstable-core-do-not-import.d-C8vB_hCN.cjs'. This is likely not portable. A type annotation is necessary.ts(2742)

The inferred type of 'context' cannot be named without a reference to '../../../../API/node_modules/@trpc/server/dist/unstable-core-do-not-import.d-C8vB_hCN.cjs'. This is likely not portable. A type annotation is necessary.ts(2742)

The inferred type of 'context' cannot be named without a reference to '../../../../API/node_modules/@trpc/server/dist/unstable-core-do-not-import.d-C8vB_hCN.cjs'. This is likely not portable. A type annotation is necessary.ts(2742)

The inferred type of 'context' cannot be named without a reference to '../../../../API/node_modules/@trpc/server/dist/unstable-core-do-not-import.d-C8vB_hCN.cjs'. This is likely not portable. A type annotation is necessary.ts(2742)

i believe this is due to the fact that the package has to compile into declaration files and doesnt work with the approuter

is it not possible for me to share this API access layer? How do apps typically handle sharing TRPC code between mobile and web?

Screenshot_2025-10-09_at_11.40.16_PM.png

Nick•10/10/25, 8:26 AM

This generally shouldn’t happen, but you should be able to fix this just by importing @trpc/server into that file

Nick•10/10/25, 8:27 AM

It’s a common problem when exporting types which depend on another package (in this case client and server)