Oldest React Version Supported by Emotion 11.x?

[torressam333]

Hi all, does anyone know what the oldest version of react is that I can use if trying to use the following:

**  "@emotion/babel-plugin": "11.11.0",
        "@emotion/cache": "^11.12.0",
        "@emotion/css": "11.11.2",
        "@emotion/is-prop-valid": "^0.8.8",
        "@emotion/react": "11.11.4",
        "@emotion/server": "11.11.0",
        "@emotion/styled": "11.11.5",**

I see emotion's package.json uses 16.14.0 but would 16.8.6 for react/react-dom still work? I didn't see anything in the changelog or readme.md about this.

Thanks.

[Andarist]

Any version higher than 16.8.0 should be compatible with Emotion.

[torressam333]

Was there an explicit upgrade guide form v10 -> 11? I see the general docs for v11 but when going from 9-10 there was a guide for migration. @Andarist

Thank you.

[Andarist]

The best we have is this https://emotion.sh/docs/emotion-11

[torressam333]

So I am trying to set up emption to recognize the css={{ }} react component styling and I want to have it set up globally via babel like so:

[
    '@babel/preset-react',
    {
      runtime: 'automatic',
      importSource: '@emotion/react'
    }
  ],

So that I don't have to add this into every file where I use the css attribute:

/** @jsxImportSource @emotion/react */
import { css } from '@emotion/react';

But I believe this is for React 17+ only, correct? If that's the case, how would I tell each of my react components that the css attribute is from @emotion/react and not React itself? In Emotion v9 I didn't have to explicitly define this css import in each file.
Is there another Global way to tell my components that css={{... is from emotion?

p.s. I am trying to upgrade from v9. Current installed deps for emotion:

 "@emotion/babel-plugin": "11.11.0",
        "@emotion/css": "11.11.2",
        "@emotion/is-prop-valid": "^0.8.8",
        "@emotion/server": "11.11.0",
        "@emotion/styled": "11.11.5",

dev deps:

    "@emotion/eslint-plugin": "11.11.0",
    "@emotion/babel-plugin": "11.11.0",

I added @emotion to my plugins array in my babel config.

What am I missing?

[torressam333]

@Andarist