Create-react-app: Reason behind the division of devDependencies and dependencies?

Created on 8 Mar 2017  路  6Comments  路  Source: facebook/create-react-app

Hi, I searched in the past issues but I couldn't find anything related.

I'm wondering why do you leave in dependencies only react and react-dom and all the other dependencies are under devDependencies?

I studied a lot about the distinction between the two lists, and to me, everything should go under devDependencies because none of them will be used directly by the compiled app, because Webpack will bundle them together into a single pack, meaning that if I do npm i my-app I could directly use it without having to install any dependency at all because the bundle would be already shipped in the npm bundle.

I know it's a bit abstract because the purpose of create-react-app is not to publish apps to npm, but it's the only way I can reason about dependencies vs devDependencies.

May you shed some light on the argument please?

Most helpful comment

There鈥檚 no real difference because the app has a build step, and produces a static bundle. So Node meaning doesn鈥檛 quite apply here.

I鈥檓 trying to use dependencies for libraries that end up in the bundle, and devDependencies for stuff that is related to build tooling. As you noted with polyfills it isn鈥檛 such a clear distinction. However, I think it can be helpful to get a sense of what鈥檚 needed for the build versus what鈥檚 used by the app.

All 6 comments

In my experience devDependencies should contain stuff like testing frameworks, assertion libraries etc. Build tools, frontend frameworks etc. should all go in dependencies. The reason for this is so you can run yarn --production in an automated build step, which only installs dependencies needed to build the app, making installation somewhat faster.

But that's just my two cents.

Yes this is another approach and I'm okay with it, but create-react-app makes use of whatwg-fetch, object-assign and others which, following your idea, should go in dependencies because they will be directly used by the app.

Same for webpack and others, in your specific case.

There鈥檚 no real difference because the app has a build step, and produces a static bundle. So Node meaning doesn鈥檛 quite apply here.

I鈥檓 trying to use dependencies for libraries that end up in the bundle, and devDependencies for stuff that is related to build tooling. As you noted with polyfills it isn鈥檛 such a clear distinction. However, I think it can be helpful to get a sense of what鈥檚 needed for the build versus what鈥檚 used by the app.

I see, thank you for the answer.

So what I've gleamed from this is the Node meaning doesn't apply here, and the distinction between devDependencies and dependencies is rather arbitrary. That being the case, I would probably just recommend for simplicity that everything just go under dependencies.

So I have a question. Say that we implemented an express back end to serve our prebuilt application in production, would you still suggest keeping react and react-dom in dependencies or would you move them to devDependencies? Assume the server is NOT referencing react or react-dom.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

rdamian3 picture rdamian3  路  3Comments

stopachka picture stopachka  路  3Comments

Aranir picture Aranir  路  3Comments

fson picture fson  路  3Comments

Evan-GK picture Evan-GK  路  3Comments