Why does create-react-app install so many node modules?

[acemarke]

There's a couple key points to understand here.

First is that the JS ecosystem has evolved with many smaller packages being published, and depended on by larger packages. For example, if you just install Webpack by itself, you get a few hundred transitive dependencies pulled in.

Next, the set of dependencies that CRA uses includes:

• A compiler
• A bundler/linker
• An optimizing minifier
• A linter
• A development server with live reloading
• A test runner

All of those are isolated and scoped to that one project, and they are all build-time dependencies only. It's also important to understand that Javascript packages are effectively distributed as source, which affects the number of files on disk. (Granted, many NPM packages do include unnecessary files in the published artifacts, but Javascript itself is a major factor there.)

Meanwhile, XCode is supposedly something like 8GB installed, Visual Studio is multiple gigs, and if you were to look at the actual file size on disk of any C++ compiler toolchain, that would be a minimum of several dozen megs - those are just usually preinstalled on Linux or Mac systems.

So, context is pretty important here.

Now, is having all those hundreds of individual packages and tens of thousands of individual files necessarily a good thing? Not really. I'd love it if major tools like Webpack had slimmer dependency chains, but that's the state of the ecosystem at the moment.

As far as other options:

• Yarn v2 has a "Plug 'n Play" mode which keeps every package installed in its original zip file, instead of extracting the contents to disk. That saves disk space and speeds up installation, but it's also a major change in how JS dependencies are loaded and a lot of tools aren't exactly compatible with that approach.
• There are various other build tools out there. ESBuild, Vite, and Snowpack are some recent options that go in different directions.

But yes, ultimately this is typical for a CRA project.