Track down server dependencies in client
Some time in the past 24 hours all my server dependencies started showing up in the client, which has completely broken my project. Is there any way to track down exactly why these dependencies are getting included (e.g., which import statement)?
4 Replies
Following sources are typical (because server and client code are mixed in the same file):
- Exporting queries from pages or component files
- toplevel "use server" (it is safer to add the directive inside the functions, that’s easier for the compiler to detect)
Exporting queries from pages or component filesWhat do you mean by "pages or component files"? Would a component file be any file that also exports any functions used as JSX elements?
Any thing that is used client-side.
I usually separate queries and components in separate files.
E.g. have a query.ts or a query directory in src which only contains queries.
If you have updated dependencies check if you have the latest version of vinxi as well.
I finally figured this out. I was importing types from a module that was initializing my database at top level (side effect) and when I switched my project to use zod those "types" became values.
Thanks for talking this through with me @Madaxen86