Custom babelrc file causes errors

[andrewgadziksonos]

Hello,

I'm seeing the following error when using a custom babel config,

error - ./pages/_app.tsx
SyntaxError: ./pages/_app.tsx: pragma and pragmaFrag cannot be set when runtime is automatic.
> 1 | import React from "react"
    | ^
  2 | import { NextPage } from "next"
  3 | import { theme, ThemeProvider, GlobalStyles, LazyProvider } from "@sonos-ui/core"
  4 | import dynamic from "next/dynamic"

And here's the custom babel config,

{
  "presets": [
    [
      "next/babel",
      {
        "preset-react": {
          "runtime": "automatic",
          "importSource": "@emotion/core"
        }
      }
    ]
  ],
  "plugins": [["babel-plugin-emotion", { "cssPropOptimization": true }]]
}

I was following along in the emotion instructions (v10) https://5faaafd0bd0f3f0008469537--emotion.netlify.app/docs/css-prop#babel-preset

[andrewgadziksonos]

Linking this incase anyone gets here system-ui/theme-ui#1160

Changing runtime: classic solved this for me