Emotion: Allow to set PostCSS plugins

[ai]

Since inline mode is now default and extract doesn’t support any dynamic, how I can process CSS in other PostCSS plugins?

If we already parse CSS with PostCSS it will be good to use same AST for other plugins too.

For example, we can pass postcss: true option and Emotion will read default PostCSS config.

[tkh44]

All of the imported plugins would have to be synchronous, correct? Can you force plugins to be synchronous?

[ai]

For example, we can start from sync-only plugins.

BTW, why we are limited in sync plugins?

[tkh44]

Babel is synchronous

[ai]

Yeap, let's start from sync PostCSS plugins.

But it is strange to have sync-only API in 2017, because it is much slower. Do we have a issue about async API? Maybe we can force Babel to implement async API faster?

[mitchellhamilton]

AFAIK Babel has no plans to implement an async API and from the loose understanding I have, it will never happen because it would require a completely different architecture for no real gain. The only way we could do anything async would be to use deasync or child_process.execSync.

[ai]

Ouh, it is real sad news and bad Babel maintenance 😔 performance is really important

[mitchellhamilton]

Babel is maintained really well by some really amazing people and they have their reasons for being sync. The only time performance will suffer is when people do weird things(like we do) that were never meant to be done in a babel plugin like reading from the file system.

[ai]

It is not first time when I see problem with not being able to write async plugin and it is sad that Babel team just ignores users needs.

We had same question in PostCSS and we implement async, because it is Node.js way.

[mitchellhamilton]

Plugins like emotion's aren't the primary use case for Babel. Babel is very different to PostCSS and implementing async would be incredibly complex and would not be worth it for the few people that want it.

[ai]

Can I help with this issue?

[vladnicula]

Is this ticket related maybe to an issue I'm having where extract static and webpack don't play well together and css-loader / extract-text-webpack-plugin is not finding the content?

[ai]

Nope this issue mostly for not calling PostCSS twice.

If 8.0 was moved to Stylis, we can close this issue.

[tkh44]

FWIW @ai you can write custom stylis plugins for your app so you can do custom logic at runtime if you wanted to.

We should probably expose this for the babel plugin and extract static mode.

[SilentImp]

just to make sure: emotion still not support postcss plugins, including autoprefixer?

[FezVrasta]

Emotion makes use of stylis to process CSS, you can write plugins for it, and it includes by default something similar to autoprefixer