Skip to content

Next.js build errorNext.js: “Module not found: Can’t resolve ‘fs’”

The build fails with Module not found: Can’t resolve fs, or path, net, tls or child_process. Those are Node.js modules that exist on the server but not in the browser, and something in the client bundle imports them. For example, a database client, an SDK or a helper file imported into a component marked "use client". Here’s how to find and fix it, in Next.js’s words, or hand it over at a fixed price.

Short answer

A file in the client bundle imports a Node.js module. Follow the import trace in the error to the "use client" file that pulls it in, then move the server code into a Server Component, a server action or a route handler, and pass only the data to the client. Add import "server-only" to server files so the next mistake fails clearly.

How server code ends up in the browser

  1. 01

    A Client Component imports server code

    “Once a file is marked with "use client", all of its imports and the components it directly renders are included in the client bundle.” Next.js, Server and Client Components

    Everything a "use client" file imports goes to the browser. If it imports your database client or a file that reads from disk, the build tries to bundle fs. Move that call to the server side and pass the result down as props.

  2. 02

    A shared helper file mixes both

    “This means it's possible to accidentally import server-only code into the client.” Next.js, Server and Client Components

    A utils file with both a formatting helper and a database call gets pulled into the client by the formatting helper. Split it into a client-safe file and a server file.

  3. 03

    Mark server files with server-only

    “To prevent accidental usage in Client Components, you can use the server-only package.” Next.js, Server and Client Components

    Install the server-only package (npm install server-only) and import it at the top of server files. Importing one into the client then fails with a clear message pointing at the mistake.

    import 'server-only'
  4. 04

    In the Pages Router, outside getServerSideProps

    “The module you're trying to import uses Node.js specific modules, for example dns, outside of getStaticProps / getStaticPaths / getServerSideProps” Next.js, Module Not Found

    Older Pages Router apps can use Node modules only inside getStaticProps, getStaticPaths or getServerSideProps, which Next.js removes from the browser bundle.

Checked against the vendor’s docs on : Next.js docs: Server and Client Components; Next.js docs: Module not found.

Rather hand it over?

Fixed scope, fixed price, paid upfront. The work happens in writing; no call needed.

Related: Vercel Module not found: Can’t resolve (casing) · Next.js window is not defined · Vercel npm run build exited with 1 · Next.js DynamicServerError

Questions

More on this error

Should I add a webpack fallback for fs?

Setting fs to false hides the error, but the code that needed fs still won’t work in the browser. Move it to the server instead.

Is this the same as the casing error on Vercel?

No. A casing mismatch names your own file. This error names a Node.js built-in module, which never exists in the browser.

Can you fix it for me?

If one bug is the whole problem, the App Fix Ticket covers it: a written diagnosis first, then the fix. If the app has more going on, the Launch Check is a written check of the whole app. Each issue found is rated critical, high, medium or low, with where it is and how it was confirmed. No issues worth fixing, no charge. If the Launch Check finds nothing rated medium or higher, Simon refunds the full $450. You keep the report either way.

A different error?

Describe it and get a written quote

Send the error and what you were doing. You get a written scope, a fixed price and a timeline; we reply by email, usually within one business day.