atlassian-labs / compiled

A familiar and performant compile time CSS-in-JS library for React.
https://compiledcssinjs.com
Apache License 2.0
1.98k stars 68 forks source link

Supporting babel macros in bundler loader/transformer. #770

Open bolu61 opened 3 years ago

bolu61 commented 3 years ago

Is your feature request related to a problem? Please describe. Support babel macros when using bundle loader/transformer.

Describe the solution you'd like

769

Describe alternatives you've considered Use babel directly, but lose the ability to extract css with Webpack.

Additional context An example of a macro is twin.macro. It needs to be evaluated before Compiled does.

itsdouges commented 2 years ago

@JakeLane I believe this could also be an issue when it comes doing transformations over nodes that Compiled will be transforming.

For example the tokens plugin we are using internally transforms any found token() function calls, but by the time it runs Compiled has already transformed the code meaning it's created an inline style that isn't needed because it can't be statically evaluated. And then finally the tokens func gets transformed to a string but by then it's too late.

Ideally the tokens transform would run first (or even better Compiled to evaluate the tokens fun hehe).