TypeScript Alias Imports don't get resolved ont the Client
I have a Monorepo with a multiple
/packages/*
packages, each has its own tsconfig.json
. I noticed that I get type errors on the client
side if I use TypeScript alias path imports on the server
package. The alias import paths for the server are only defined in the server/tsconfig.json
and not in the client/tsconfig.json
.
If I change the alias imports on the server side to relative imports, it works on the client. It seems like TypeScript cannot follow the imports correctly from client to server, because it doesn't check the server tsconfig.
Anyone the same issue?4 Replies
@zirkelc I have the exact same issue. Were you able to solve this?
Yes, there are two options from my point of view:
1. create a shared global tsconfig.json in your project root that defines the path aliases. Then your server and client have their package-level tsconfig.json inherit from the shared tsconfig.json. All path alaises are defined in the shared tsconfig.json, the package-level tsconfig.json have no alaiases on their own.
2. use typescript projects refrences like here: https://github.com/zirkelc/trpc-monorepo-with-project-references
GitHub
GitHub - zirkelc/trpc-monorepo-with-project-references
Contribute to zirkelc/trpc-monorepo-with-project-references development by creating an account on GitHub.
@zirkelc Thanks! Which one did you go with?
@Shooe#6468406 I used the first option with global paths, just because I have a big monorepo and it was easier to make this change. I think the second option is better if you have multiple packages, but I have not enough experience with project references and there might be some doenside that I'm not aware of.