diff --git a/src/content/docs/docs/guides/tech/with-nextjs.mdx b/src/content/docs/docs/guides/tech/with-nextjs.mdx index c2e6f088d..954e31d10 100644 --- a/src/content/docs/docs/guides/tech/with-nextjs.mdx +++ b/src/content/docs/docs/guides/tech/with-nextjs.mdx @@ -47,6 +47,14 @@ Example of re-exporting a page from `src/pages` in the Next.js `app`: export { ExamplePage as default, metadata } from '@/pages/example'; ``` +### Server and client public APIs \{#server-and-client-public-apis\} + +In Next.js App Router, modules that can be used on the client and server-only modules may exist together within a single slice. If a server-only module is exported from `index.ts`, server-only side effects can propagate into the client module graph when a Client Component imports that slice, which can lead to build errors. + +When this problem occurs, add `index.server.ts` to the public API. + +- `index.server.ts`: Modules that must only be imported on the server, such as Server Components or data access functions marked with `server-only` + ### Middleware \{#middleware\} If you use middleware in your project, it must be located in the project root alongside the Next.js `app` and `pages` folders. diff --git a/src/content/docs/docs/reference/public-api.mdx b/src/content/docs/docs/reference/public-api.mdx index aa16f0f6e..a896c49be 100644 --- a/src/content/docs/docs/reference/public-api.mdx +++ b/src/content/docs/docs/reference/public-api.mdx @@ -62,6 +62,12 @@ Try to keep cross-imports to a minimum, and **only use this notation on the Enti +## Environment-specific Public APIs + +A slice’s public API should generally be represented by `index.ts`, and freely customizing it is not recommended. + +However, even modules within the same slice may need to run in different environments. If these modules are exported together from a single `index.ts`, the environment boundary may be broken, or the bundler may incorrectly include code that should not be bundled together. When this problem actually occurs, separate the public API by adding files that match the runtime environment. For an example, see [Server and client public APIs in Usage with Next.js](/docs/guides/tech/with-nextjs#server-and-client-public-apis). + ## Issues with index files Index files like `index.js`, also known as barrel files, are the most common way to define a public API. They are easy to make, but they are known to cause problems with certain bundlers and frameworks.