applying styled-jsx plugins to .babelrc broke https://native.directory on heroku deploy

[jim]

Because I use nested media queries and pseudo selectors, I needed to install a plugins that would allow me to use styled-jsx the way I had been using it.

That worked fine!

...until I had to deploy to Heroku, I encountered an exception that said next/babel options are not configurable when trying to apply this:

{
  "presets": [
    [
      "next/babel",
      {
        "styled-jsx": {
          "plugins": [
            "styled-jsx-plugin-postcss"
          ]
        }
      }
    ]
  ]
}

After spinning my wheels for a couple of hours with no immediate solution, I switched the codebase to use glamor.

Issue for reference: vercel/next.js#3133

[jim]

Fixed this by porting all styles to glamor, so I don't have to worry about styled-jsx anymore.