[@emotion/babel-preset-css-prop] Unused @emotion/css import

[mjackson]

• emotion version: 10.0.5
• react version: 15.6.2

Relevant code:

In my .babelrc config:

{
  "presets": ["@emotion/babel-preset-css-prop"]
}

What you did:

I used @emotion/babel-preset-css-prop in my .babelrc and ran my code through Rollup.

What happened:

I got the following log output:

(!) Unused external imports
default imported from external module '@emotion/css' but never used

Problem description:

The @emotion/babel-preset-css-prop preset imports @emotion/css even if it isn't used.

Suggested solution:

Make people import "@emotion/css" explicitly if they need it? I don't know how common it is to use Emotion w/out the css function, but I'm planning on using only @emotion/core with object styles on my current project.

The weird thing is, I can't figure out where this import is actually happening. I see only one import for @emotion/core looking through the source... is it happening somewhere in the babel-plugin-emotion source?

[mjackson]

Awesome, thanks @mitchellhamilton! 👏

[khanakia]

I am facing the same issue after i used the config from here https://emotion.sh/docs/css-prop

{ "runtime": "automatic", "importSource": "@emotion/react" }

"css" is imported from external module "@emotion/react" but never used in "src/widgets/hello/index.tsx".