NextJS app router support

[AashJ]

Any plans to support the NextJS app router or an example of how to do so? I think the NextResponse and NextRequest objects are slightly different than the NextAPiResponse/NextAPIRequest objects, so the current iteration doesn't work without some messing around of the objects.

[ccssmnn]

This should be fairly easy to set up once a fetch adapter is implemented #188

[Vercjames]

Forked and support added here: https://github.com/Vercjames/package-trpc-swagger

[kdy1]

I made https://www.npmjs.com/package/next-trpc-openapi

[Mehulparekh144]

.npmjs.com/package/next-trpc-openapi

I tried using ur framework I am getting errors like for each HTTP method instead. ⨯ No HTTP methods exported in 'C:\Users\Mehul\Desktop\testT3\demo4\src\app\api[...trpc]\route.ts'. Export a named export for each HTTP method. GET /api/say-hello 405 in 40ms ⨯ Detected default export in 'C:\Users\Mehul\Desktop\testT3\demo4\src\app\api[...trpc]\route.ts'. Export a named export for each HTTP method instead. ⨯ No HTTP methods exported in 'C:\Users\Mehul\Desktop\testT3\demo4\src\app\api[...trpc]\route.ts'. Export a named export for each HTTP method.

` [trpc]/route.ts import { inferRouterContext } from "@trpc/server"; import { FetchCreateContextFn, FetchCreateContextFnOptions, fetchRequestHandler } from "@trpc/server/adapters/fetch"; import { type NextRequest } from "next/server";

import { env } from "~/env"; import { appRouter } from "~/server/api/root"; import { createTRPCContext } from "~/server/api/trpc"; import { db } from "~/server/db";

/**

• This wraps the createTRPCContext helper and provides the required context for the tRPC API when

• handling a HTTP request (e.g. when you make requests from Client Components). */ // export const createContext = async (req: NextRequest) => { // return createTRPCContext({ // headers: req.headers, // }); // }; export const createContext: FetchCreateContextFn = async (opts: FetchCreateContextFnOptions) => { const req = opts.req; // Access request object from options // Your logic to create context const headers = req.headers;

  return { headers, db } as inferRouterContext; // Return the context object };

const trpcApiRouteHandler = (req: Request) => fetchRequestHandler({ endpoint: "/api", req, // Your trpc router router: appRouter, // Your trpc createContext createContext, });

export { trpcApiRouteHandler as DELETE, trpcApiRouteHandler as GET, trpcApiRouteHandler as HEAD, trpcApiRouteHandler as PATCH, trpcApiRouteHandler as POST, trpcApiRouteHandler as PUT, }; `

` [...trpc]\route.ts

import { createOpenApiNextAppHandler } from "next-trpc-openapi"; import { appRouter } from "~/server/api/root"; import { createContext } from "../trpc/[trpc]/route";

const handler = createOpenApiNextAppHandler({ // Your trpc router router: appRouter, // Your trpc createContext createContext : createContext, responseMeta: undefined, onError: undefined, });

export default handler; `

Can you help with this. Appreciate it. Thanks

[mrgoonie]

Forked and support added here: https://github.com/Vercjames/package-trpc-swagger

Thanks!