"Component definition is missing display name" Next.js build fail using code from docs

[tr1s]

What version of Next.js are you using?

11.1.2

What version of Node.js are you using?

15.5.0

What browser are you using?

Chrome

What operating system are you using?

macOS

How are you deploying your application?

Vercel

Describe the Bug

A recent update in my npm packages (probably from Next.js) has caused build failures.

The code styled-components provides in the docs that you add to _document.js in order for styled-components to work in a Next.js project is no longer working.

I can't figure out how to fix this code even when looking at the react/display-name rules. Any help would be appreciated, thank you!

The error I get in vercel:

What the error looks like in my code:

These are the package updates I made that caused the sudden build failure:

Expected Behavior

No build errors.

To Reproduce

Add the code from styled-components docs to _document.js in order for styled-components to work in a Next.js project.

[stefanprobst]

see #28786 (comment)

[ijjk]

Closing as a duplicate of #28786 (comment) per above comment

[tr1s]

For whoever stumbles across this:

Naming the function doesn't fix this issue, but downgrading eslint-config-next does fix the build error.

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.