Emotion: Pass from option to PostCSS

[ai]

• emotion version: github master
• react version: irrelevant

What you did:

Have browserslist config in my project root.

What happened:

This config didn’t apply.

Problem description:

Here you parse CSS by PostCSS: https://github.com/tkh44/emotion/blob/89cb7956f667e71226f2bb589bbc2bb574cb38b7/src/parser.js#L39

But you didn’t pass from option to parser. As result nodes in AST don’t have origin file name.

As result, Autoprefixer didn’t load correct browserslist config.

Suggested solution:

We need to pass parser(css, { from: 'path/to/file.js' })

[ai]

Also why you use styled-component/vendor/postcss-safe-parser fork? You can use standard postcss-safe-parser.

Styled Components works on client-side, this is why they care about library bundle size and fork parser to reduce size.

You parse CSS on server-side so you don’t care about parse size and could use origin parser.

If you will use origin parser, you will not need postcss-js. You can process AST by Autoprefuxer without any transformation.

Also, you can use Stylelint for this AST.

[ai]

Wow, it was fast!