CODEWITHSUNDEEP
reactjscreate-react-apppostcssautoprefixer
Daniel Tonon
Daniel Tonon

Reputation: 10472

How do you enable Autoprefixer CSS Grid translations in create-react-app without using control comments?

I am trying to enable Autoprefixer Grid translations in a Create React App application.

I do not want to eject.

I'm also using a CSS-in-JS solution that makes it impossible to add comments to the CSS. So the /* autoprefixer grid: autoplace */ control comment method is not possible.

Is it still possible to enable grid translations without ejecting?

Upvotes: 1

Views: 817

Answers (2)

Daniel Tonon
Daniel Tonon

Reputation: 10472

At the time of asking, it was not possible. It is now though.

If you apply an AUTOPREFIXER_GRID = autoplace environment variable when you are compiling your code, you can enable grid translations without using control comments.

You can read about how to do this in the Autoprefixer documentation.

Upvotes: 2

Vsevolod Golovanov
Vsevolod Golovanov

Reputation: 4216

As mentioned in the official documentation:

CSS Grid Layout prefixing is disabled by default, but it will not strip manual prefixing. If you'd like to opt-in to CSS Grid prefixing, first familiarize yourself about its limitations.

To enable CSS Grid prefixing, add /* autoprefixer grid: autoplace */ to the top of your CSS file.

Upvotes: 0

Related Questions