How to configure what directories contains server-side only code?

[n9]

Summary

I have a directory server where I put server-side code, which si imported from route.ts. I need to call node.js API from there (such as node:fs/promises).

However this fails with:

Code generation for chunk item errored
An error occurred while generating the chunk item [project]/server/QueryStore.ts [app-client] (ecmascript)

Caused by:
- the chunking context (unknown) does not support external modules (request: node:fs/promises)

Debug info:
- An error occurred while generating the chunk item [project]/server/QueryStore.ts [app-client] (ecmascript)
- Execution of *EcmascriptChunkItemContent::module_factory failed
- Execution of <ModuleChunkItem as EcmascriptChunkItem>::content_with_async_module_info failed
- Execution of *EcmascriptChunkItemContent::new failed
- Execution of EcmascriptModuleContent::new failed
- the chunking context (unknown) does not support external modules (request: node:fs/promises)

How can I mark that files under server/ directory should only run on the server?

Additional information

No response

Example

No response

[SametDulger]

Use "use server" at the top of your server-only modules.

Never import server modules into client components.

Keep clean separation between client/server files.

Access server code from client via API routes or server actions.

[icyJoseph]

Hi,

Sorry the other answer is not really helpful, and nor is it addressing your issue at all.

route.ts Route handlers, are ever only compiled for server runtime, or rather, not packages for the client.

exports from Route Handlers are also checked at build time and cause errors if unexpected exports are found, in part to prevent a layer where route.ts exports so many things that it can end up leaking to client side, through transitive dependencies, this way you are forced to have a utils-kind-of-file, that the bundler can then allocated appropriately.

How can I mark that files under server/ directory should only run on the server?

The base answer is you shouldn't have to, but of course in a large application, code might end up being imported by client side modules, so you can enforce certain rules, for example with import 'server-only' which will throw errors at dev and build time, whenever a server module ends up in the wrong side, aka, the client module graph. In that case, you won't be able to build until you fix that.

---

Using use server, has had a story that maybe I can quickly summarize here. Adding that does this:

Instead of individually marking functions with 'use server', you can add the directive to the top of a file to mark all exports within that file as Server Functions that can be used anywhere, including imported in client code.

That means, that while yes you are declaring this module to be still wrapped on the server module graph, in spite of it potentially being imported to client side modules ('use client'), essentially making it a escape hatch, it will make these exports, reachable POST endpoints in which ever page they end up.

It is not wrong though, you can do it, you just need to know the implications.

---

Is it possible though, that [project]/server/QueryStore.ts is somehow imported into a client component? I think node: kind of imports should work fine in Turbopack and Webpack server side. So I wouldn't look into that too much right now.

Try adding import 'server-only' to [project]/server/QueryStore.ts - that, AFAIK, should give us a more complete import stack and such.