当我在NPM上搜索包时,我想看到包的大小(KB或MB等)。NPM似乎没有显示这一信息。

我如何确定一个NPM包会给我的项目增加多少膨胀?


当前回答

一个“快速而肮脏”的方法是使用curl和wzrd。在快速下载压缩包,然后grep文件大小:

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

下载的包被压缩了,但没有压缩到gzip,但是当您比较两个或多个包时,您可以很好地了解包的相对大小。

其他回答

为了检查不同的包对你的包的影响。你可以查看source-map-explorer。

安装:

npm install -g source-map-explorer

用法:

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

这将打开一个可视化的空间是如何在您的压缩包中使用的。

如果你使用Visual Studio Code,你可以使用一个名为Import Cost的扩展。

这个扩展将在编辑器中内联显示导入包的大小。扩展利用webpack与babili-webpack-plugin,以检测导入的大小。

你可以查看npm-module-stats。它是一个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);
});

它可能看起来有点啰嗦,但它解决了您恰当描述的问题。

看看这个模块成本项目。这是一个npm包,它会列出包的大小和子元素的数量。

安装: NPM install -g cost-of-modules

用法: 在您工作的目录中运行cost-of-modules。

你可能想要衡量的是,如果你要将一个包添加到你的应用程序包中,它的影响。大多数其他答案只会估计源文件的大小,这可能不准确,因为内联注释,长var名称等。

我做了一个小工具,它会告诉你包的最小+ gzip大小后,它进入你的bundle -

https://bundlephobia.com