tRPC typings not working - Cannot import @trpc/server on client

hi guys, my structure is the following: - Turborepo TS compiling to cjs - A common packcage which defines the tRPC router - A server service which imports it & runs on expressjs - A NextJS client which imports the type and supposed to interact with the server however, i cannot import the type on the client due to the follwowing error:
@01/app:build: ../../packages/api/src/routers/index.ts:4:14
@01/app:build: Type error: The inferred type of 'appRouter' cannot be named without a reference to '../../../../node_modules/@trpc/server/dist/core/router'. This is likely not portable. A type annotation is necessary.
@01/app:build:
@01/app:build: 2 | import { userRouter } from './user.router';
@01/app:build: 3 |
@01/app:build: > 4 | export const appRouter = router({ user: userRouter });
@01/app:build: | ^
@01/app:build: 5 | export type AppRouter = typeof appRouter
@01/app:build: ../../packages/api/src/routers/index.ts:4:14
@01/app:build: Type error: The inferred type of 'appRouter' cannot be named without a reference to '../../../../node_modules/@trpc/server/dist/core/router'. This is likely not portable. A type annotation is necessary.
@01/app:build:
@01/app:build: 2 | import { userRouter } from './user.router';
@01/app:build: 3 |
@01/app:build: > 4 | export const appRouter = router({ user: userRouter });
@01/app:build: | ^
@01/app:build: 5 | export type AppRouter = typeof appRouter
my code is the following Common package:
import { router } from '../trpc';
import { userRouter } from './user.router';

export const appRouter = router({ user: userRouter });
export type AppRouter = typeof appRouter
import { router } from '../trpc';
import { userRouter } from './user.router';

export const appRouter = router({ user: userRouter });
export type AppRouter = typeof appRouter
Client:
'use client';

import { createTRPCProxyClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from '@01/api';
import { transformer } from '@01/api';
import { assertDefinedValue } from '@01/common';

const client = createTRPCProxyClient<AppRouter>({
transformer,
links: [
httpBatchLink({
url: assertDefinedValue(
process.env.API_SERVER_URL,
'API_SERVER_URL ENV Is Undefined On App!',
),
}),
],
});
export default function Docs() {
}
'use client';

import { createTRPCProxyClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from '@01/api';
import { transformer } from '@01/api';
import { assertDefinedValue } from '@01/common';

const client = createTRPCProxyClient<AppRouter>({
transformer,
links: [
httpBatchLink({
url: assertDefinedValue(
process.env.API_SERVER_URL,
'API_SERVER_URL ENV Is Undefined On App!',
),
}),
],
});
export default function Docs() {
}
Server:
import { appRouter, createContext } from '@01/api';
const app = express();
app.use(
'/',
trpcExpress.createExpressMiddleware({
router: appRouter,
createContext: createContext,
}),
);
import { appRouter, createContext } from '@01/api';
const app = express();
app.use(
'/',
trpcExpress.createExpressMiddleware({
router: appRouter,
createContext: createContext,
}),
);
0 Replies
No replies yetBe the first to reply to this messageJoin