Lib with collection of styled-components work with console errors in next.js app. Related to babel config

Please make sure you have read the submission guidelines before posting an issue

Prerequisites

Please answer the following questions for yourself before submitting an issue.

• I am running the latest version
• I checked the documentation (nx.dev) and found no answer
• I checked to make sure that this issue has not already been filed
• I’m reporting the issue to the correct repository (not related to React, Angular or any dependency)

Expected Behaviour

I would expect the styled-components library to adopt the same babel config as the next.js application. Especially since the ssr option prevents the issue where className may change between server and client.

https://codesandbox.io/s/next-styled-components-working-y7r68

Current Behaviour

It is very noticeable that the classNames of the rendered components in dev mode do not include their file names and their display names

https://github.com/mcastro84/styled-components-issue

Failure Information (for bugs)

Often (admittedly, not all browser refreshes) will produce a console error

Warning: Prop `className` did not match. Server: "someClassName" Client: "someOtherClassName"

Steps to Reproduce

https://github.com/mcastro84/styled-components-issue

yarn start

Context

Please provide any relevant information about your setup:

We have multiple next.js apps in the nx monorepo and would like to share components between the two. We started off with styled-components before adopting next.js apps so we have a lot of legacy components that we would like to use

As you can see, I have implemented the code from the styled-components next.js example so that is not the issue: https://github.com/zeit/next.js/tree/canary/examples/with-styled-components

[jaysoo]

A workaround is outlined here: https://github.com/nrwl/nx/issues/4611#issuecomment-788990096

The issue is that the root babel.config.json and additional babelrc files aren’t being picked up. This will be fixed in the next version, but you can use the workaround above for now.

[kirjai]

Fixed by #4944