Skip to content

How to fix the `can't resolve module` error in Next.js

FULL-STACK WEB DEVELOPMENT BOOTCAMP

2024 COHORT SIGNUPS END TOMORROW

I ran into this issue with Next.js:

Module not found: Can’t resolve ‘fs’

In a Next.js page your can import methods from a file that loads Node.js modules.

This is fine, as long as you also use the imported method in getStaticProps().

Example, I had this code:

import { getData } from '../lib/data'

//...

export async function getStaticProps() {
  const data = getData()
  return {
    props: {
      data,
    },
  }
}

When I commented const data = getData(), Next started giving me the error 'fs' module not found because fs was the first module I imported in lib/data.

It might happen with any other Node library you import first.

This happens because anything in getStaticProps() is just called when ran in a server environment, but if we don’t invoke the Node.js function in there, Next.js can’t know that.

  • Learn modern web development in my BOOTCAMP (SIGNUP END TOMORROW FEB 20, 2024)
  • THE VALLEY OF CODE (+ PRO), your web development manual
  • I wrote 15+ coding BOOKS, all available in THE VALLEY OF CODE PRO
  • Indie solopreneur internet business masterclass SOLO LAB (summer 2024)