1

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?

Daniel Tonon
  • 9,261
  • 5
  • 61
  • 64

2 Answers2

2

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.

Daniel Tonon
  • 9,261
  • 5
  • 61
  • 64
0

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.

Vsevolod Golovanov
  • 4,068
  • 3
  • 31
  • 65
  • Sorry, I'll update my question and provide the answer. While not incorrect, I already knew about the `/* autoprefixer grid: autoplace */` thing. My issue was that I was using a CSS-in-JS solution and I needed to be able to turn on CSS Grid translations without using control comments. At the time of asking this, it was not possible to do what I wanted. – Daniel Tonon Apr 10 '20 at 16:20