I've noticed that even a simple webpage that shows "hello world" takes up over 600 MBs on my laptop, the node_modules folder alone is like 590MBs for me. Also, when I run npx create-react-app it takes couple minutes for everything to get ready and I'm assuming this is because for each React app npm generates a new node_modules?

Just out of curiosity, why is this the case? Why can't React apps just rely on a global dependency so there's only one node_modules for all apps (and if there is a way to do this, please let me know)?

CodePudding user response：

This is the current architecture of an NPM project. Probably also a legacy.

can't React apps just rely on a global dependency?

Well, actually they can. This is what PNPM is doing: https://pnpm.io/

Maybe a future version of NPM would also integrate that, but I do not expect it to come so quickly (when you have a whole ecosystem around your current architecture, the inertia to change is quite high).

CodePudding user response：

npx create-react-app will create package.json and will install all needed dependencies to make sure app runs & builds. It won't assume you have any global npm packages available. You can use global packages, yet that's up to you. Yet if you have global package on your machine and then send code to another machine which does not have that global package, it's out of scope of react app's code and there will be missing package errors.

Also if you build the app, it will drop most of the stuff in node_modules while a lot of things are tree-shaked during build

https://webpack.js.org/guides/tree-shaking/

also a lot of code inside react is for development env. only to provide you with better developer experience - better errors, better tools etc. all of that is skipped on production build. So no worries much about node modules locally.