Webpack5 Errors with Serverless Mode in Next + Next-Auth + Netlify-Plugin-Nextjs

[bcnichols3]

Describe the bug
I'm running Next 11 and @netlify/plugin-nextjs 3.6.3 and seeing this message in the onPreBuild step when I deploy:

The "target" config property must be one of "serverless", "experimental-serverless-trace". Building with "serverless" target.

However the next.js team recommends you not use serverless. The results is a webpack 5 error that seems to be related to next-auth: it depends on TypeORM internally, which has a few dynamic optional imports that are used depending on the DB you hook TypeORM up to. Even when they're not being used, and should be shook, Webpack is unable to find those dependencies and you'll get errors like this:

ModuleNotFoundError: Module not found: Error: Can't resolve 'mongodb' in '/opt/build/repo/node_modules/typeorm/platform'

Netlify blocks me from building if it demands I use serverless. The only way I've been able to build locally using Next11 and Next-Auth is without a specified target in my next.config.js. Is there a way to tell the Netlify next plugin not to turn on target: serverless?

To Reproduce
Steps to reproduce the behavior:

1. Create a Next 11 app
2. Set up Next-Auth with a database (I used PostgreSQL)
3. Don't specify a DB adapter (next-auth will use TypeORM as default)
4. Deploy to Netlify
5. See errors in log

Expected behavior
Next is able to complete a build that Netlify can deploy.

Versions

• Next.js: 11.0.0

• next-auth: 3.27.1

• netlify plugin: first no install, then 3.6.3

• netlify.toml:

[[plugins]]
  package = "@netlify/plugin-nextjs"

[ascorbic]

Hi. The Essential Next.js plugin requires a serverless target because that's how it deploys the routes to Netlify functions. The other features are then implemented in our wrapper functions. Can you try using experimental-serverless-trace and see if that fixes the import issue?

[bcnichols3]

I can absolutely experiment with that later tdoay @ascorbic ! Do you happen to know what the differences are between experimental-serverless-trace and serverless?

[lindsaylevine]

@bcnichols3 when using serverless, next tries to inline all dependencies for you, which has failed for some db providers + next on netlify like prisma, firebase and mongo in the past. with experimental-serverless-trace, next does not inline dependencies, which allows netlify to try to correctly bundle them into your functions. (see vercel/next.js#8797 (comment) for more info). if e-s-t doesn't work for you, maybe give this comment a look? we've unfortunately seen a handful of next-auth + mongo pain points :/

[bcnichols3]

I greatly appreciate the extra color here. The true problem here is the lack of clarity on what's actually failing and why — and since this is caused by several techs interconnecting, obviously it's not an easy problem for just the next-auth team or just the typeorm team or just the netlfify-plugin-nextjs team or just the webpack team to address.

I will dig into e-s-t mode when I can and report back. With luck that'll solve my issue.

Edit: I'll also point out i dont believe this has to do with mongodb at all -- even just installing mongo explicitly will cause the issue to shift to Can't resolve 'mysql' or one of the other dozen typeorm dynamic imports. With what you describe, it sounds like the real culprit is the act of bundling node modules doesn't play nice with how typeorm has expressed these dependencies.

[lindsaylevine]

yeah, i hear you :/ do let us know about e-s-t. it's possible also adding esbuild as your node_bundler (https://docs.netlify.com/configure-builds/file-based-configuration/#functions) could help. we'll get to the bottom of it!

[tbooth-prog]

Hi, I was having the exact same issue and can confirm that setting the target to experimental-serverless-trace in next.config.js did the trick for me. Thanks

[lindsaylevine]

@tbooth-prog thanks for letting us know! 🙏 we'll keep open for a little til we hear from @bcnichols3. hopefully e-s-t solves their issue as well, but it may be a greater issue if their overall request is to opt out of serverless.

[bcnichols3]

@lindsaylevine e-s-t has cleared the webpack error! I'm getting a db connection timeout error ATM -- but that may be (A) my screw-up or (B) a separate issue :)

[lindsaylevine]

@bcnichols3 oh no! i'll go ahead and close this one, but if you find you can't resolve your db connection timeout, please feel free to open a new issue! we used to have netlify function timed out after 10.1 seconds issues with some db integrations, but we patched it, so i'd be surprised if it's that.