Styled components as styled engine in CRA app with craco and react scripts 5

[PrimulaX]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

I'm using styled-components as styled engine which needs alias and craco is used to override webpack configs which only supports react-script 4* (plus craco-alias plugin is already deprecated), meanwhile I need to update react-scripts, can I use styled-components as styled engine without craco?

Expected behavior 🤔

So I need to use styled-components as styled engine without craco because craco doesn't support react-scripts 5.
Sorry for create this issue as bug report.

Steps to reproduce 🕹

No response

Context 🔦

No response

Your environment 🌎

No response

[PrimulaX]

I was able to override style-engine with npm override that way:

"overrides": {
    "@mui/styled-engine": "https://registry.npmjs.org/@mui/styled-engine-sc/-/styled-engine-sc-5.6.1.tgz" 
  },

But I was unable to reference it to the existing style-engine-sc pgk.

[mnajdova]

Seeing dilanx/craco#378 (comment) I am not very hopeful for using craco too. In addition, https://github.com/arackaf/customize-cra is abandoned too (last version from 2 years ago).

Maybe we can try to use something like rewire, here is an example of it: https://marmelab.com/blog/2021/07/22/cra-webpack-no-eject.html#rewire-in-practice, but I haven't personally tried it so I cannot guarantee that it will work.

If someone from the community would like to help and investigate this further it would be great 👌