Open umakantp opened 3 years ago
UPDATE: This is not happening with any custom components which we create locally. It happens only to components which are imported from bootstrap-styled. Either it is a bug or I'm missing on some config may be
I have not tested ssr so I can't help on that one.
Np. I'll keep adding my notes here as I find more.
I disabled ssr: false as follows in my .babelrc:-
["styled-components", {"ssr": false}]
Now it has stopped using display name as prefix and sticking to sc-
only names. They are still different though.
Here is simple repo which re-produces the bug: https://github.com/umakantp/bootstrap-styled-ssr
Hope it helps in debugging and fixing the problem.
Perhaps @taddei can help?
Hi Team,
I created an example using https://github.com/vercel/next.js/tree/canary/examples/with-styled-components with bootstrap-styled.
I created few components using components from bootstrap-styled as follows:
Now when I consume/use this Btn component. It throws errors in console as follows:
If we carefully see, When rendering from service side, styled component uses component name/display name as prefix in class name i.e. Button-. When it renders on client it doesn't use Button (instead uses sc-)
I have followed the all the guidelines of styled components + bootstrap styled as per doc. Any pointers what could be the issue?