Integrating Hono RPC with Turborepo Structure

[HarshitKmr10]

Hi everyone,

I'm building an application using turborepo with the following structure:

• apps
  • api (Hono API)
  • web (Next.js)
• packages
  • db
  • data-access

I'm keen on utilizing Hono's RPC functionality to export API route types from the api app and integrate them into my Next.js application in the web app. However, the challenge arises due to turborepo's design, where apps cannot directly share imports.

One potential solution I considered was moving the API to the packages directory. However, this deviates from the recommended practice of keeping applications within apps and packages dedicated to reusable functionality.

Question:

Is there a viable approach to achieve my goal of using Hono RPC with API route types in the Next.js app while adhering to the preferred turborepo structure?

[Rykuno]

challenge arises due to turborepo's design, where apps cannot directly share imports.

Why not? I've done this with a NestJS api in the past.

To keep things from getting messy I have a package called shared where the exported types/data from my apps folder are kept; but until it starts getting out of hand there is nothing wrong with sharing types/exports between apps.

[HarshitKmr10]

Can you share me an example of how can I do it ?
Do you mean just add @repo/api to the nextjs package.json? If I try to do this I get "Cannot find module '@repo/api' or its corresponding type declarations.ts(2307)".
I can't shift anything to a shared package as I want the type of hono router and for that, I would then need to shift my entire hono application to the shared directory

[Rykuno]

You have to make sure that type in package.json is equal to "module" in your api. This is more of a Turborepo question so you might have more luck continuing this in their discussions/discord.

[HarshitKmr10]

Sorry just realised it was a mistake from my end. I forgot to add the export value pairs in package.json of the API folder.
Thanks for the assistance!

[HarshitKmr10]

Hey, Now I facing another issue. The types are different when I am exporting from the API and when I am using on the client side.

[HarshitKmr10]

@Rykuno Could you help me with this ?

[Rcmade]

Remove the
"type": "module",
from your app/api/package.json
file

[Rcmade]

Remove the
"type": "module",
from your app/api/package.json
file

[sujjeee]

hey @HarshitKmr10 got any fix for the issue?

[feliche93]

I am having the same issue. 😬 @Rcmade or @sujjeee have you found any issue?

[feliche93]

Nevermind, this solves it: https://github.com/orgs/honojs/discussions/2900

[sujjeee]

Hey @feliche93, are you using turborepo? If so, have you set up ESLint and Prettier? If not, what are you using for linting and formatting?

[feliche93]

I am just using Biome

[sujjeee]

@feliche93 yeah i end put using biome too