Next.js: `Cannot find module 'next/dist/next-server/server/node-polyfill-fetch'` for vercel monorepo serverless functions

[shunkakinoki]

Bug report

Hi, first of all love your work!

I'm migrating to use the NEW monorepo support for vercel,

and although the functions succeed to deploy, I get the following error when invoking it.

Describe the bug

Cannot find module 'next/dist/next-server/server/node-polyfill-fetch'

To Reproduce

Reproduction coming ...

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

System information

• OS: [e.g. macOS, Windows]
• Browser (if applies) [e.g. chrome, safari]
• Version of Next.js: [e.g. 6.0.2]
• Version of Node.js: [e.g. 10.10.0]

Additional context

Add any other context about the problem here.

[timneutkens]

Please provide a full reproduction.

[belgattitude]

@timneutkens I've contacted support already, but you can reproduce it here:

• https://github.com/belgattitude/vercel-monorepo-test
• https://vercel-monorepo-test-web-app.vercel.app/

[vongohren]

Im also experiencing this on all my deployes, both production and test environemnt. Im not using monorepo feature, but am using typescript. And it has been working fine for the last couple of days. But started failing atleast yesterday.

No idea what it comes from, but Im adding my package.json for help

{
  "name": "homie",
  "version": "1.0.0",
  "engines": {
    "node": "12.x"
  },
  "repository": "[email protected]:vongohren/homie.git",
  "author": "Snorre lothar von Gohren Edwin <[email protected]>",
  "license": "MIT",
  "dependencies": {
    "@sendgrid/mail": "^7.1.1",
    "antd": "^4.1.3",
    "dayjs": "^1.8.27",
    "firebase": "^7.15.0",
    "firebase-admin": "^8.12.1",
    "firebase-functions": "^3.1.0",
    "next": "^9.3.6",
    "next-compose-plugins": "^2.2.0",
    "next-iron-session": "^4.1.2",
    "node-fetch": "^2.6.0",
    "random-words": "^1.1.1",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-loading-skeleton": "^2.0.1",
    "react-toastify": "^6.0.8",
    "swr": "^0.2.0",
    "winston": "^3.2.1",
    "winston-papertrail": "^1.0.5"
  },
  "devDependencies": {
    "@babel/plugin-proposal-optional-chaining": "^7.9.0",
    "@types/node": "^12.12.11",
    "@types/react": "^16.9.4",
    "@types/react-dom": "^16.9.4",
    "babel-plugin-import": "^1.13.0",
    "babel-plugin-inline-import": "^3.0.0",
    "babel-plugin-module-resolver": "^4.0.0",
    "google-gax": "^2.6.0",
    "npm-run-all": "^4.1.5",
    "tslint": "^5.12.0",
    "typescript": "^3.2.2"
  },
  "scripts": {
    "build": "next build",
    "dev": "NODE_OPTIONS='--inspect' next -p 3100"
  }
}

[mattphillips]

Sorry for the +1 spam on this but unfortunately I am also running into this issue.

I have a workaround for this issue (that I had been using previously when monorepo support was experimental) if anyone finds it useful:

I am setting the Root Directory to the yarn workspace and have a custom build command that builds the Next.js app and copies all of the compiled code up into the workspace for deployment. Example here: https://github.com/mattphillips/next-public

This solution isn't great but I'm unable to upgrade to full monorepo support on Vercel while all functions are falling over with this bug.

[vongohren]

@mattphillips Im not able to use this workaround to deploy new versions. @Timer is this beeing investigated because my production is currently broken and I cannot deploy a new version, because this happens each time.

There are alot of issues laying around on this, but no clear fix
https://github.com/serverless-nextjs/serverless-next.js/issues/440
https://github.com/vercel/next.js/discussions/14405

[paulogdm]

The team is taking a look as we speak. It should be resolved in a few days.

Our apologies for the inconvenience.

[vongohren]

@paulogdm any news? 😊

[good-idea]

If it's any help, here are two repos that have the same setup, one is working while the other is not:

https://github.com/good-idea/hikawa.studio (does not work - the app builds & prerenders SSG successfully, but requests to all pages fail with the same error as above)
https://github.com/good-idea/spinellikilcollin.com (works)

Both have the following vercel settings:

[JakeCooper]

Not sure it'll help, but here's another project with the same issue. Blocking production deployments sadly as well :(

https://vercel.com/railwayapp/railway-web

[timneutkens]

We've tracked down the issue yesterday and the team is working on a fix 🙏

[belgattitude]

@timneutkens that' fantastic ! You rock guys. Thanks a million.

[JakeCooper]

+1 to what @belgattitude said! Great work, and loving the official monorepo support so far!

[paulogdm]

Hello everyone 👋
A fix has been shipped to canary (@vercel/next@canary). I will post updates on how to try it out here.

[paulogdm]

You can test the fix by following these steps:

• Include the following environment variable in your deployment (through the environment variables UI): Key: FORCE_BUILDER_TAG. Value: canary
  

• If you have a vercel.json file, then you can follow the same method:

{
  "build": {
    "env": {
      "FORCE_BUILDER_TAG": "canary"
    }
  }
}

Let us know if you have any positive results.

[belgattitude]

Hey @paulogdm I can confirm it fixes the issue with api-route: https://github.com/belgattitude/vercel-monorepo-test/pull/10.

Great work !

PS: any idea why a simple api is so slow ?:

• link: https://vercel-monorepo-test-web-app-git-vercelforcebuildertag.belgattitude.vercel.app/api/hello (200/300ms)
• source: https://github.com/belgattitude/vercel-monorepo-test/blob/master/apps/web-app/src/pages/api/hello.ts

[paulogdm]

PS: any idea why a simple API is so slow ?:

I would recommend that you check the region where you deployed your function. It seems to be in SFO1. Therefore, the response you are observing is due to latency (probably).

For paid accounts, you can customize the region: https://vercel.com/docs/configuration#project/regions

[vongohren]

@paulogdm Im still getting the error for some reason. Trying out both the env variable in the settings and tried the vercel.json. Nothing positive happens to me unfortunately. Same logs

00:23:20:36
2020-09-06T22:23:20.479Z    8438ba21-b91f-4ac2-8bab-adcd27423b7b    ERROR   Unhandled error during request: Error: Cannot find module 'next/dist/next-server/server/node-polyfill-fetch'
Require stack:
- /var/task/build/serverless/pages/api/apartment/[id].js
- /var/task/now__launcher.js
- /var/runtime/UserFunction.js
- /var/runtime/index.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:966:15)
    at Function.Module._load (internal/modules/cjs/loader.js:842:27)
    at Module.require (internal/modules/cjs/loader.js:1026:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at eval (webpack-internal:///mctB:1:18)
    at Object.mctB (/var/task/build/serverless/pages/api/apartment/[id].js:239:1)
    at __webpack_require__ (/var/task/build/serverless/pages/api/apartment/[id].js:23:31)
    at eval (webpack-internal:///iWDc:4:106)
    at Module.iWDc (/var/task/build/serverless/pages/api/apartment/[id].js:210:1)
    at __webpack_require__ (/var/task/build/serverless/pages/api/apartment/[id].js:23:31) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/var/task/build/serverless/pages/api/apartment/[id].js',
    '/var/task/now__launcher.js',
    '/var/runtime/UserFunction.js',
    '/var/runtime/index.js'
  ]
}
2020-09-06T22:23:20.479Z    8438ba21-b91f-4ac2-8bab-adcd27423b7b    ERROR   Uncaught Exception  {"errorType":"Error","errorMessage":"Cannot find module 'next/dist/next-server/server/node-polyfill-fetch'\nRequire stack:\n- /var/task/build/serverless/pages/api/apartment/[id].js\n- /var/task/now__launcher.js\n- /var/runtime/UserFunction.js\n- /var/runtime/index.js","code":"MODULE_NOT_FOUND","requireStack":["/var/task/build/serverless/pages/api/apartment/[id].js","/var/task/now__launcher.js","/var/runtime/UserFunction.js","/var/runtime/index.js"],"stack":["Error: Cannot find module 'next/dist/next-server/server/node-polyfill-fetch'","Require stack:","- /var/task/build/serverless/pages/api/apartment/[id].js","- /var/task/now__launcher.js","- /var/runtime/UserFunction.js","- /var/runtime/index.js","    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:966:15)","    at Function.Module._load (internal/modules/cjs/loader.js:842:27)","    at Module.require (internal/modules/cjs/loader.js:1026:19)","    at require (internal/modules/cjs/helpers.js:72:18)","    at eval (webpack-internal:///mctB:1:18)","    at Object.mctB (/var/task/build/serverless/pages/api/apartment/[id].js:239:1)","    at __webpack_require__ (/var/task/build/serverless/pages/api/apartment/[id].js:23:31)","    at eval (webpack-internal:///iWDc:4:106)","    at Module.iWDc (/var/task/build/serverless/pages/api/apartment/[id].js:210:1)","    at __webpack_require__ (/var/task/build/serverless/pages/api/apartment/[id].js:23:31)"]}
Unknown application error occurred

[paulogdm]

@vongohren Do you have a minimal repro that we can investigate?

[vongohren]

@paulogdm yes yes, sorry for late reply! But here are two links to follow

https://github.com/vongohren/vercel-function-error
https://repro-error.vercel.app/

When clicking google sign in it sends a get function and gets 502 back. The error in the logs are this

[styfle]

@vongohren It looks like you used the Override switch to change your project settings Output Directory. Try using the default settings instead of Override.

[Timer]

Closing this as we confirmed a few of the reproductions above are now fixed.

[vongohren]

@styfle thanks for reply, so what you are telling me that there is a bug in vercel when using this setup and override? Or is there anythin else I can do differently?

@Timer did you guys confirm test my case? And that was the override situation?

[styfle]

@vongohren I confirmed your code deploys fine without using any Override switches, just using defaults.

Your code uses next build which sets the default output directory to .next but your projects settings was attempting to use a different output directory, build.

https://github.com/vongohren/vercel-function-error/blob/91635ad4f549d5a1dc85af124c8dd1d51b1e768e/package.json#L44

The solution is to uncheck the Override option in your project settings, thanks!

[vongohren]

@styfle thanks for quick replies, but im sorry, this does not work for the current base im trying on.
I see now that you missed some context. I have added my next.config.js file. It was automatically ignored in git for some reason. It has .backup now.

In this config file the 'distDir' used to be build, thats why the override worked fine for me. And also why it probably still doesnt work for me.

Maybe there is something inside the backup that affects things?

As I said, it still doesnt work with turning of overrides. I turned off all three overrides, made sure that my build, the next config does not choose a dist dir, in my code. Which I just added an representation of my config file.
Deployed a new production build, and still experiencing it. What can I do?

[vongohren]

I can confirm removing the https://github.com/vongohren/vercel-function-error/blob/master/next.config.js.backup without the backup, makes it work again.

Things was git ignored so it was lost in context, sorry about that.
But then atleast we have the culprit and maybe you guys can have some insight to letting me know why it failed?

[yournatalita]

@vongohren Thank you for the comment! You gave me a hint that I maybe have the same issue. Comparing with your file I found out that line config.devtool = 'eval-source-map'; is causing this error on Vercel in my case.

Removing it or adding conditional dev/build check helped for me.

Even though I resolved my issue, I haven't found any docs about it and in my custom server project I haven't had the issue with source-map enabled.

I find it handy on dev servers to be able to inspect scripts. Is this bug? Or designed behaviour?
Where can I read the info about webpack settings that should be blocked on serverless vercel deploy?