如何查看npm包的大小？

在NPM上搜索包时，我希望看到包的大小（KB或MB等）。NPM似乎没有显示这些信息

我如何确定NPM包将给我的项目增加多少膨胀？

看看这个项目。它是一个npm包，将列出一个包的大小和子包的数量

安装：

npm安装-g模块成本

用法： 在您正在使用的目录中运行模块的成本

您可以退房。它是一个npm模块，可以在不安装或下载模块的情况下获取npm模块及其依赖项的大小

用法：

var stats = require("npm-module-stats");

stats.getStats("glob").then((stack) => {

  let dependencies = Object.keys(stack);
  let totalSize = dependencies.reduce((result, key, index) => {
    return result + stack[key].size;
  }, 0);

  console.log('Total Size in Bytes ', totalSize);
  console.log('Total Dependencies ', dependencies.length-1);

}).catch((err) => {
  console.error(err);
});

source-map-explorer bundle.min.js
source-map-explorer bundle.min.js bundle.min.js.map
source-map-explorer bundle.min.js*
source-map-explorer *.js

---

它可能看起来有点冗长，但它解决了您所描述的问题。

您可能想要衡量的是，如果您将一个包添加到应用程序包中，它会产生什么样的影响。大多数其他答案只估计源文件的大小，这可能由于内联注释、长var名称等原因而不准确

我制作了一个小实用程序，它会告诉您在包进入包后包的最小压缩大小-

一种“快速且肮脏”的方法是使用curl并快速下载缩小的包，然后grep文件大小：

curl-ihttps://wzrd.in/standalone/axios@最新的| grep内容长度

---

下载是缩小的，但不是gzip，但是当您比较两个或多个包时，您可以很好地了解包的相对大小。

如果您使用webpack作为模块绑定器，请查看：

我绝对推荐第一种选择。它在交互式树形图中显示大小。这有助于您在捆绑文件中查找包的大小

这篇文章中的其他答案显示了项目的大小，但您可能没有使用项目的所有部分，例如，树摇晃。其他方法可能无法显示准确的大小。

我创建了一个工具，用于检查给定npm包的tarball大小，包括依赖关系树中的所有tarball。这让您了解了提前添加依赖项的成本（安装时间、磁盘空间、运行时资源、安全审计等）

在上图中，焦油球的大小是包装的tar.gz，总大小是所有焦油球的大小。这个工具非常基本，但它做到了它所说的

还提供了一个。您可以这样安装它：

npm i -g download-size

$ download-size request
request@2.83.0: 1.08 MiB

然后像这样使用它：

npm i -g download-size

$ download-size request
request@2.83.0: 1.08 MiB

---

源代码可在Github上获得：，和。

尝试使用包大小

npx package-size vue,vue-router,vuex react,react-dom,react-router,redux

---

如果使用Visual Studio代码，则可以使用名为的扩展

此扩展将在编辑器中内联显示导入包的大小。扩展使用带有babili webpack插件的webpack来检测导入的大小

---

今年年初，我创建了包裹恐惧症，希望能将包裹大小信息输入npmjs.com，并随着时间的推移跟踪包裹膨胀情况

这是为了在运行

npm install

后测量磁盘空间，以获得服务器端依赖项（如

express

）或开发依赖项（如

jest

）

您可以在此处的自述文件中阅读有关此工具和其他类似工具的更多信息：

---

更新2020

npmjs.com网站上提供了“解包大小”（基本上是发布大小）以及“总文件”。然而，这并不是递归的，这意味着

npm安装

可能会更大，因为单个包可能依赖于多个包（因此包恐惧症仍然是相关的）

从CLI打印此信息的功能还有一个挂起状态。

是另一个可以显示包总大小的工具：

npx豪法特茉莉花

---

以检查不同包对捆绑包的影响。你可以退房

安装：

npm install -g source-map-explorer

用法：

var stats = require("npm-module-stats");

stats.getStats("glob").then((stack) => {

  let dependencies = Object.keys(stack);
  let totalSize = dependencies.reduce((result, key, index) => {
    return result + stack[key].size;
  }, 0);

  console.log('Total Size in Bytes ', totalSize);
  console.log('Total Dependencies ', dependencies.length-1);

}).catch((err) => {
  console.error(err);
});

source-map-explorer bundle.min.js
source-map-explorer bundle.min.js bundle.min.js.map
source-map-explorer bundle.min.js*
source-map-explorer *.js

这将打开一个可视化的空间是如何在您的缩小捆绑使用

---

---

好吧，使用另一种服务，比如那样。示例：

curl-ihttps://unpkg.com/axios@0.16.1/dist/axios.min.js | grep内容长度

漂亮的用户界面！谢谢，这正是我想要的。不过在超大的软件包上要花很长时间。@Black应该会返回此链接：现在指向一个非常有用的工具顺便说一句。他们还推出了一个测试版的

package.json

scanner！这是非常伟大和准确的！我希望它作为VScode中的一个扩展存在，导入成本有时不是很准确。第二级DEP呢？有点过分，需要在计算之前重新安装所有模块。但这项工作是可以完成的。不要使用此软件包-它会创建一个名为nodemodules.bak的工件文件夹，该文件夹会产生难看的副作用安装或重新安装总是会造成过度伤害，我也在寻找没有任何东西可以重新安装的选项。我更喜欢使用@bkk这个软件包会产生什么丑陋的副作用？也适用于WebStorm。这个扩展不适用于所有的软件包。它显示计算。。。然后，即使将超时值更改为一个非常大的数字，也会突然消失。这很好，但为什么它的结果与bundlephobia有如此显著的差异呢？e、 g.比较lodash的结果。lowerfirst@DanyalAytekin因为他们在测量不同的东西。简短回答：如果您正在查看前端软件包，请使用BundlePhobia。如果您正在查看后端软件包，请使用PackagePhobia。如果您感兴趣，我们将在中提供更多详细信息。劫持此对话是因为我想指出一个有助于从您的计算机中获取可用空间的工具。显然，

node_模块

占用了我机器上的atm 21bg；可以帮助您做到这一点]（）似乎不会计算任何依赖项的大小。。。当我运行它时，它只列出了我要求的包。当我实际安装时，安装了1000多个软件包。。。占用10多个