Closed iDVB closed 2 years ago
Great questions...
I think yes, mainly for SSR. For client-side, it wouldn't matter much except for debugging. For the lib, you would want to use the namespace
option to avoid conflicting with application SSR, I think. https://styled-components.com/docs/tooling#namespace
I don't know yet, but I'd like to figure it out. There was very little change in v1.10.6. Am I understanding that you tried all the versions between v1.10.5
and v2.0.2
?
I'd be interested in that too!
thanks @agriffis I'll try that namespace
option. We use Gatsby so most things are pre-rendered (SSR) and client-side.
To be 100% fair I'm not sure it happened in exactly v1.10.6
I just know v1.10.5
works and the latest for a while now has not. To make matters worse, we're now dealing with this _interopRequireDefault is not a function issue with seemingly no fix yet... so I can't even seem to test out other options until I have that fixed.
I will keep at trying to fix this new _interopRequireDefault
issue and once its fixed will jump back into this one and see if I can get you an exact version where things go wrong.
@agriffis ok.... I just identified that the issue is NOT with a specific version of babel-plugin-styled-components
but more about making sure both the custom lib and the consuming project both use the SAME version. So we updated to the latest version and just used a resolution in the consuming project to lock it to the same version and everything works.
Odd. I wonder if this sensitivity is all that was introduced at some point.
Likely similar to #261 and #351 but their resolution does not seem to work/apply.
Env:
@ourcompany/react-ui-components
= Custom Styled Components UI libprojectx
= Project that consumes/uses the above libWe too are noticing that our projects (
projectx
) that consume our ui lib (@ourcompany/react-ui-components
) are experiencing this same issue with the wrong styles being applied.The way we build
Our
@ourcompany/react-ui-components
lib is bundling with rollup and the following.babelrc.js
Our consuming repo/project (
projectx
) is using gatsbyjs and gatsby-plugin-styled-componentsVersion of babel-plugin-styled-components
We've had to lock babel-plugin-styled-components to
v1.10.5
in order to get it working right. Even tried updated everything to latestv2.0.2
and still broken.Questions
1) What IS the recommended way to author/bundle a styled-components lib. Do you use
babel-plugin-styled-components
on the lib and again on the consuming project (excluding node_modules, eg. that lib) 2) Why did our configuration suddenly stop working withbabel-plugin-styled-componentsv1.10.5
? Anything after this and we get this same incorrect styles being applied bug. 3) Are there any example / existing repos that have this working that I could look at for guidance?