teambit / envs

Component development environments for the Bit community
https://bit.dev/bit/envs
Other
63 stars 9 forks source link

Add support for zero-runtime libs like linaria #144

Closed magne4000 closed 1 year ago

magne4000 commented 4 years ago

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 or babel 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 the mini-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 with bit build icon command

Expected Behavior

I would want to see my extracted CSS in the dist

Screenshots, exceptions and logs

No CSS here image

Specifications

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

-

GiladShoham commented 4 years 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.

magne4000 commented 4 years ago

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.

GiladShoham commented 4 years ago

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.