小型项目node_modules达600MB？如何分析依赖空间占用

原生命令行工具（无需额外安装） #

Linux/macOS #

在项目根目录执行：

du -sh node_modules/* | sort -rh

该命令会列出node_modules下每个包的磁盘占用，并按体积从大到小排序，快速定位体积最大的依赖。

Windows（PowerShell） #

打开PowerShell进入项目根目录，执行：

Get-ChildItem node_modules | Sort-Object Length -Descending | Select-Object Name, @{Name="Size(MB)"; Expression={[math]::Round($_.Length/1MB,2)}}

输出每个依赖的名称和体积（MB），按体积降序排列。

专用npm工具 #

无需全局安装，直接用npx运行以下工具：

• npx pkg-size：扫描node_modules，输出每个包的大小、文件数量等信息，结果按体积排序。
• npx disk-usage-cli node_modules：生成包含子依赖层级的详细占用报告。

结合你提供的依赖列表，核心原因如下：

1. react-scripts：作为Create React App的核心依赖，它内置了完整的前端构建工具链（webpack、Babel、ESLint、Jest、webpack-dev-server等），这些工具本身包含大量代码和嵌套依赖，是体积占比最高的部分，哪怕项目规模小，工具链的体积不会缩减。
2. Firebase完整SDK：你仅使用通知模块，但默认安装的firebase包包含Auth、Firestore、Storage、Messaging等所有子功能的代码，冗余模块占用了大量空间。
3. 测试依赖位置不当：@testing-library/jest-dom和@testing-library/react属于开发测试工具，应放在devDependencies中（虽然不影响当前node_modules总大小，但生产环境安装时可跳过），它们依赖的jest、jsdom等库体积不小。
4. 嵌套依赖累积：顶级依赖的子依赖会层层叠加，比如react-leaflet依赖Leaflet，leaflet-routing-machine依赖Leaflet及其他路由库，这些嵌套依赖的体积累积后推高了总大小。

内容的提问来源于stack exchange，提问作者ZeeSHAN Ali