Search code examples
javascriptherokuwebpacknext.jsvercel

Module not found: Can't resolve './Page.module.css' Next 13

I get this error when running npm run build on Vercel and Heroku but not on my local computer:

Module not found: Can't resolve './Page.module.css'

I try to import this file from app/page.tsx and they are both in the same directory, the cases match too. Here is a screenshot:

enter image description here

The line causing the issue from page.tsx:

'use client'
import styles from "./Page.module.css"

next.config.js only contains environment variables. package.json and webpack settings have NOT been touched in any way.

Solution

  • See: How do I resolve a 'module not found' error?

    One possible cause for this issue is the fact that some filesystems are case-insensitive, however Vercel deployments use a case-sensitive filesystem. Because of this, it is possible that when you change the letter-casing in filenames on your local machine, Git will only pick up changes in your respective static import statements. This would mean that your repository is now syntactically incorrect, resulting in a build error when deploying the repository on the Vercel platform.

    If you're using git, the solution is to run the following command in your environment:

    git config core.ignorecase false