prototype - css-in-js (glam)

[threepointone]

making this issue and assigning to myself, to make a prototype of glam that's compatible with this package, just to prove that it's possible.

the idea is to get this - facebook/create-react-app#2730 (comment) to "work".

[threepointone]

oh, please assign this to me when you can :)

[threepointone]

up for grabs, if anyone else wants to take a crack at it -

• relay
• preval (kent, I assume you'll try this one yourself?)

[EnoahNetzach]

Would this macro prototype also work for e.g. styled components?

If not, I'll be glad to contribute with a tailored one!

[threepointone]

I'm just working on a small prototype to prove that it works, if you want something more full featured/matching the SC api, you're likely better off integrating with emotion https://github.com/tkh44/emotion since they already have much of the compliation work done

[EnoahNetzach]

Thank you for pointing me to emotion, but I wanted to try to prototype a SC macro to work with Create React App 😉.

[threepointone]

styled-components already works in CRA (by nature of being a pure runtime lib), not sure what you'd use the macro for?

[threepointone]

oh is it for this? https://github.com/styled-components/babel-plugin-styled-components go for it, could be useful

[EnoahNetzach]

yep!

[kentcdodds]

Done! You can now use preval without adding the preval plugin to your babel config. Simply add babel-macros to your plugins instead, then:

import preval from 'babel-plugin-preval/macros'

const x = preval`
  module.exports = Math.random()
`

And poof, it works. Can also do a function call or JSX :) Fun stuff.

[kentcdodds]

Gonna close this in favor of emotion-js/emotion#132