serverless-next.js: Using webpack 5 causes 503

Using webpack 5, returns the following from Cloudfront:

503 ERROR
The request could not be satisfied.
The Lambda function associated with the CloudFront distribution is invalid or doesn't have the required permissions. We can't connect to the server for this app or website at this time. There might be too much traffic or a configuration error. Try again later, or contact the app or website owner.
If you provide content to customers through CloudFront, you can find steps to troubleshoot and help prevent this error by reviewing the CloudFront documentation.

Using versions:

@sls-next/serverless-component@1.19.0-alpha.43
"next": "^10.1.3",

About this issue

Original URL
State: closed
Created 3 years ago
Comments: 18

Most upvoted comments

Same for 10.2.3

talaikis on May 28, 2021

+1, happened after upgarde of next.js from 10.2.0 to 10.2.1, using webpack 5. Downgrading next.js solves the issue.
"@sls-next/serverless-component": "1.19.0"

Same issue with 10.2.2.

alecpirillo on May 21, 2021

+1, happened after upgarde of next.js from 10.2.0 to 10.2.1, using webpack 5. Downgrading next.js solves the issue.

"@sls-next/serverless-component": "1.19.0"

talaikis on May 20, 2021

The fix has been published in the latest alpha version, please try and let me know if it works?

EDIT: made another fix for posix paths (e.g it was also needed for CDK construct) by just normalizing to posix-style paths after doing all the path.join or path.relative operations, I believe it should all be fixed now

dphang on Jun 9, 2021