Closed magne4000 closed 1 year ago
You should probably create a custom babel-base-compiler as well. one which knows to create the result vinyl files of the css from the babel raw output.
Thanks, I'm really interested to be able to test it completely, but I'll need to dig a bit deeper into babel to test that, so I'll give it a try at some point in the future if nobody beat me to it.
writing new envs will become much much easier soon, once the harmony release will be out. So once you come back to it, you will probably won't need to touch the components we talked about it here.
Description
Describe the bug
Linaria is a zero-runtime CSS in JS lib which I would like to use with bit.dev components, but without success for now.
I understand that current state of
react-typescript
orbabel
compilers does not allow me to compile Linaria styled components because the zero runtime part is handled by a babel loader + mini-css-extract-plugin webpack plugin. I'm stuck because I do not have an equivalent of themini-css-extract-plugin
part handled by Webpack.Steps to Reproduce
I created a custom babel compiler for this use case.
It just misses the extract-css part.
When I use it, it compiles the code, but without any CSS extracted.
I created a dedicated branch on a repo already using bit.dev to test linaria: https://github.com/getstation/catalog/tree/linaria-test
Only the
Icon
component is migrated to support Linaria here, so it can be tested withbit build icon
commandExpected Behavior
I would want to see my extracted CSS in the dist
Screenshots, exceptions and logs
No CSS here![image](https://user-images.githubusercontent.com/1098371/84394237-f5abb280-abfc-11ea-87f1-f326c3af9983.png)
Specifications
14.7.6
12.16.1
1.22.4
MacOS
Additional context
-
Describe the solution you'd like
-
Describe alternatives you've considered
I tried using the webpack bundler with the same babel config and it works, but each bundle is too heavy because it contains all its dependencies.
Additional context
-