Yamakasinge Posts

Yamakasinge

•Created by Yamakasinge on 4/25/2025 in #❓-help

When upgrading to v11, the AppRouter in .d.ts is any

Hello ! I just tried to upgrade from trpc v10 to trpc v11. I am on a monrepo, the the tRPC router type is built as part of a package. In the code, I simply export procedures :

export const appRouter = router({ ...procedures })
export type AppRouter = typeof appRouter

export const appRouter = router({ ...procedures })
export type AppRouter = typeof appRouter

When I hover over AppRouter, everything is fine :

type AppRouter = Router<{
    ctx: Context;
    meta: object;
    errorShape: {
        data: {
            code: TRPC_ERROR_CODE_KEY;
            httpStatus: number;
            path?: string;
            stack?: string;
            name?: string | undefined;
            message?: string | undefined;
            cause?: unknown;
        };
        message: string;
        code: TRPC_ERROR_CODE_NUMBER;
    };
    transformer: false;
}, DecorateCreateRouterOptions<...>> & DecorateCreateRouterOptions<...>

type AppRouter = Router<{
    ctx: Context;
    meta: object;
    errorShape: {
        data: {
            code: TRPC_ERROR_CODE_KEY;
            httpStatus: number;
            path?: string;
            stack?: string;
            name?: string | undefined;
            message?: string | undefined;
            cause?: unknown;
        };
        message: string;
        code: TRPC_ERROR_CODE_NUMBER;
    };
    transformer: false;
}, DecorateCreateRouterOptions<...>> & DecorateCreateRouterOptions<...>

However, when I'm building the type I get this in .d.ts :

export declare const appRouter: import('@trpc/server/dist/unstable-core-do-not-import').BuiltRouter<{
    ctx: import('./context').Context;
    meta: object;
    errorShape: {
        data: {
            code: import('@trpc/server/dist/unstable-core-do-not-import').TRPC_ERROR_CODE_KEY;
            httpStatus: number;
            path?: string;
            stack?: string;
            name?: string | undefined;
            message?: string | undefined;
            cause?: unknown;
        };
        message: string;
        code: import('@trpc/server/dist/unstable-core-do-not-import').TRPC_ERROR_CODE_NUMBER;
    };
    transformer: false;
}, import('@trpc/server/dist/unstable-core-do-not-import').DecorateCreateRouterOptions<{
    boiteAOutils: BoiteAOutilsRouter;
    config: ConfigRouter;
    auth: AuthRouter;
    users: UsersRouter;
    testDiagnostic: TestDiagnosticRouter;
    modulesFormations: FormationRouter;
    documents: DocumentsRouter;
    quotes: QuotesRouter;
    blog: BlogPostRouter;
    contact: ContactRouter;
    images: ImageRouter;
    faq: FaqRouter;
    pay: PayRouter;
    events: EventsRouter;
    admin: AdminRouter;
    sirene: SireneRouter;
}>>;
export type AppRouter = typeof appRouter;

export declare const appRouter: import('@trpc/server/dist/unstable-core-do-not-import').BuiltRouter<{
    ctx: import('./context').Context;
    meta: object;
    errorShape: {
        data: {
            code: import('@trpc/server/dist/unstable-core-do-not-import').TRPC_ERROR_CODE_KEY;
            httpStatus: number;
            path?: string;
            stack?: string;
            name?: string | undefined;
            message?: string | undefined;
            cause?: unknown;
        };
        message: string;
        code: import('@trpc/server/dist/unstable-core-do-not-import').TRPC_ERROR_CODE_NUMBER;
    };
    transformer: false;
}, import('@trpc/server/dist/unstable-core-do-not-import').DecorateCreateRouterOptions<{
    boiteAOutils: BoiteAOutilsRouter;
    config: ConfigRouter;
    auth: AuthRouter;
    users: UsersRouter;
    testDiagnostic: TestDiagnosticRouter;
    modulesFormations: FormationRouter;
    documents: DocumentsRouter;
    quotes: QuotesRouter;
    blog: BlogPostRouter;
    contact: ContactRouter;
    images: ImageRouter;
    faq: FaqRouter;
    pay: PayRouter;
    events: EventsRouter;
    admin: AdminRouter;
    sirene: SireneRouter;
}>>;
export type AppRouter = typeof appRouter;

So this seem to work great, however, when I hover AppRouter, it's type any. The root of the issue seems to be that typescript fails to resolve type in the unstable import such as : import('@trpc/server/dist/unstable-core-do-not-import').BuiltRouter Is there anything I need to change in my tsconfig.json ?

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "noImplicitAny": false,
    "outDir": "dist",
    "skipLibCheck": true
  },
  "include": [
    "src",
    "test"
  ]
}

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "noImplicitAny": false,
    "outDir": "dist",
    "skipLibCheck": true
  },
  "include": [
    "src",
    "test"
  ]
}

The source one :

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "types": [
      "@types/node",
      "@eliah/build/types"
    ],
    "strict": true,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "disableSizeLimit": true
  }
}
=

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "types": [
      "@types/node",
      "@eliah/build/types"
    ],
    "strict": true,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "disableSizeLimit": true
  }
}
=

Thank you !

2 replies