Emotion: babel-plugin-emotion can be installed as dev dependency

[deadcoder0904]

I was checking docs at https://emotion.sh/docs/install#with-babel-plugin-emotion & I think it should be installed as a dev dependency, correct me if I am wrong but I think it is not needed to be shipped in production

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs. Thank you for your contributions.

[deadcoder0904]

Bad bot

[jooj123]

I have the same question actually - one of the docs are incorrect?

[deadcoder0904]

Yes

[jooj123]

Im pretty sure it should be a dev dependancy - as you should be babel-ing at build time
This setup seems to work for me fine also

[cheton]

The babel-plugin-emotion plugin should be installed as "devDependencies" rather than "dependencies", or it will introduce a conflict of multiple @babel/types versions especially when running with babel-eslint:

$ npm ls @babel/types
├─┬ [email protected]
│ ├─┬ @babel/[email protected]
│ │ ├─┬ @babel/[email protected]
│ │ │ └── @babel/[email protected]
│ │ ├─┬ @babel/[email protected]
│ │ │ ├─┬ @babel/[email protected]
│ │ │ │ └── @babel/[email protected]
│ │ │ ├─┬ @babel/[email protected]
│ │ │ │ └── @babel/[email protected]
│ │ │ └── @babel/[email protected]
│ │ ├─┬ @babel/[email protected]
│ │ │ └── @babel/[email protected]
│ │ └── @babel/[email protected]
│ └── @babel/[email protected]
└─┬ [email protected]
  └─┬ [email protected]
    └─┬ [email protected]
      └─┬ @babel/[email protected]
        └── @babel/[email protected]

$ npm ls @babel/traverse
└─┬ [email protected]
  └── @babel/[email protected]

[maraisr]

@cheton maybe this isn't really a problem? Shouldn't we resolve those issues then?

My two cents are that, if you think of your library being pulled into another project, only the dependencies will be pulled, now depending on how you bundled, if you're providing source, then babel-plugin-emotion needs to be in the dependencies so the consuming application knows to apply that plugin, as the .babelrc gets gobbled up recursively _AFAIK_. If you're providing a built out artefact, then, semantically it'd belong in the devDependencies, as it really isn't needed.

I guess all that matters is how you're bundling the library. If it's not a lib at all, and merely an app that gets deployed. Then put all that "at-built-time" stuff in devDependencies, that way you know exactly what dependencies are required to make the app run, and what deps are required to make the app build.

Tl;DR: The docs should state to install it as a dev dependency.
Without generalising too much, but a large portion of the readers will be building apps with it, and therefore it makes sense to be a dev dep. For those building libraries, they'd probably already know to make it a "prod" dependency.

[nick-brady]

docs I found said to install as dev

https://github.com/emotion-js/emotion/tree/master/packages/babel-plugin-emotion#installation

which is conflicting docs with the link you posted. I believe you're correct that its a dev dependency, and the emotion website should be updated.