How to fix Next.js Vercel deployment module not found error

This answer worked for me: https://stackoverflow.com/a/55541435/3051080

TL;DR; update git cache:

git rm -r --cached .
git add --all .
git commit -a -m "Versioning untracked files"
git push origin master

I had to edit my package.json to use the next binary that ships in the node_modules/next directory:

"scripts": {
  "start": "node_modules/next/dist/bin/next start -p $PORT"
}

Not the most elegant fix but it works.

I had the same issue. In my github desktop I noticed that a file that was capitalized in the editor was not in the github desktop. Fixed the spelling to match what was showing on github and the project built successfully.

in my case it looks like something to do with yarn and the next dependency i.e. inside node_modules/next/dist/bin/next having conflicts information about something.

never quite understand why after using next & building our code into production we still have to rely on the (relatively) heavy module next.

the whole notion of doing build is supposed so that it becomes independent of the build tools.

It seems like I have run into the same error.

The strange thing is that I have been building on Vercel all weekend without any problems, and it only started failing after I added Tailwind CSS to my project.

The first build with the Tailwind CSS addition succeded but styling was not loaded.

You can still see the result at https://rolfmadsen.now.sh/.

The local build with "vercel dev" still runs perfectly.

See the repository at https://github.com/rolfmadsen/search

Error from Build logs:

22:28:35.104  
Running "npm run build"
22:28:35.287  
> [email protected] build /vercel/6ddf29b8
22:28:35.287  
> next build
22:28:35.328  
internal/modules/cjs/loader.js:983
22:28:35.329  
  throw err;
22:28:35.329  
  ^
22:28:35.329  
Error: Cannot find module '../build/output/log'
22:28:35.329  
Require stack:
22:28:35.329  
- /vercel/6ddf29b8/node_modules/.bin/next
22:28:35.329  
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
22:28:35.329  
    at Function.Module._load (internal/modules/cjs/loader.js:862:27)
22:28:35.329  
    at Module.require (internal/modules/cjs/loader.js:1042:19)
22:28:35.329  
    at require (internal/modules/cjs/helpers.js:77:18)
22:28:35.329  
    at Object.<anonymous> (/vercel/6ddf29b8/node_modules/.bin/next:2:46)
22:28:35.329  
    at Module._compile (internal/modules/cjs/loader.js:1156:30)
22:28:35.329  
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
22:28:35.329  
    at Module.load (internal/modules/cjs/loader.js:1000:32)
22:28:35.329  
    at Function.Module._load (internal/modules/cjs/loader.js:899:14)
22:28:35.329  
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12) {
22:28:35.329  
  code: 'MODULE_NOT_FOUND',
22:28:35.329  
  requireStack: [ '/vercel/6ddf29b8/node_modules/.bin/next' ]
22:28:35.329  
}
22:28:35.331  
npm ERR! code ELIFECYCLE
22:28:35.331  
npm ERR! errno 1
22:28:35.332  
npm ERR! [email protected] build: `next build`
22:28:35.332  
npm ERR! Exit status 1
22:28:35.332  
npm ERR! 
22:28:35.332  
npm ERR! Failed at the [email protected] build script.
22:28:35.332  
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
22:28:35.336  
npm ERR! A complete log of this run can be found in:
22:28:35.336  
npm ERR!     /vercel/.npm/_logs/2020-06-21T20_28_35_332Z-debug.log
22:28:35.342  
Error: Command "npm run build" exited with 1

I tried all of the above problems and nothing works.

The problem got solved when I changed the version of next.js. In case, someone is searching for a solution and nothing works...

I added a NODE_ENV="production" environment variable in vercel which hosed everything for me. Once I removed it, things recovered.

If the program runs normally by executing node_modules/next/dist/bin/next, you should suspect that the symbolic link of the file is broken.
In my case, it occurred during AWS deployment, and it occurred in the process of compressing the files for deployment.
So, I was able to solve the problem by adding the symlinks option during compression as shown below.

zip -r --symlinks xxxx

If it is deployed on a server such as AWS, like me, download the actually distributed program and Check the node_modules/.bin/next file. If the symbolic link is broken, you will need to find and fix the cause of the broken link during the deployment process.

cf) https://github.com/vercel/next.js/discussions/14897#

What about creating a .gitignore file, and adding the .next folder to it ?

How I resolved the missing module error on Vercel.

1. install the package explicitly so that it is present in your package.json
2. then import the supposed missing module into the app and use it.

For Example (just a scenario) // lets assume lodash is said to be the missing module,

1 Make sure it is present in your package.json

"dependencies": {
    // some dependencies ...
    "lodash": "^4.17.20",
    // some other dependencies ...
},

2 Import and use it in your app (usually, I just console.log the import in a non-production env.)

import LODASH from 'lodash'

if (process.env.NODE_ENV !== 'production') console.log(LODASH)

I created the folder in lowercased, then, renamed it in capitalized, updated all the imports, but, for some reason, Github didn't update the folder name when I pushed the changes. I needed to renamed with a different name. It worked.

For me it was a problem with that specific package, when I looked for it in my package.json and under node_modules i couldn't find it. Even though it was working in local builds somehow.

1. Delete package-lock.json (rm package-lock.json)
2. Delete node_modules (rm -R node_modules)
3. Switch versions of Node, which is easy if you have Node installed via NVM (nvm install 17, nvm use 17)
4. Install dependencies again with new version of node (npm install)

I ran into this issue on a server running node 16.15.0 LTS, On my local machine node v16.12.0, and on another server running node v12.22.10 and it was not giving the error.

Took a look at my dependencies and decided to switch to Node 17.

devDependencies": {
    "@types/node": "17.0.23",
    "@types/react": "17.0.43",

After following the steps above and using Node 17 code ran successfully, and no more error.

If node_modules are transferred to server via git as stated in @Joe Haddad's answer. A different strategy for dealing with the issue worked better for me.

On the server, remove all node and next build files carried over to server, re-install and re-build

rm -R node_modules && rm -R .next && rm package-lock.json && npm install && npm run build

Edit or create .gitignore and add node_modules and .next then do the following.

Clear out cached files in git repo, re-add files respecting .gitignore, commit and push changes back to your local computer.

git rm -r --cached ./ && git add ./ && git commit -a -m "Removing ignored files" && git push

On local computer to sync up with newly ignored files. Does not affect local work environment and now you can push and pull successfully.

git pull
npm install

This approach is faster and saves you the trouble of dealing with git stuff on local machine and pushing back to the server.

In my case, I was using turborepo, and I forgot to add the build folder of a library in the outputs options of build

"tasks": {
    "build": {
      "dependsOn": ["^build"],
      "outputs": ["dist/**", ".next/**", "!.next/cache/**"]
}

In my case, I opened the project on GitHub and noticed that the folder name didn’t change there, but it did change locally. I renamed the folder directly in the repository, and that solved the problem.

From Vercel's How do I resolve a 'module not found' error?:

The 'module not found' error is a syntax error that appears when the static import statement cannot find the file at the declared path. This common syntax error is caused by letter-casing inconsistencies that are present in your filename(s) between your repository and local machine, or both.

Why this Happens

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.

How to Resolve

The build logs will indirectly point to the file that is the causing the issue. Make sure that your file's letter-casing correctly matches with its respective static imports. Also make sure that your letter-casing in your filenames and imports are identical between your repository and local machine. If you are using git, make sure git config core.ignorecase false is set in your environment.