当我在NPM上搜索包时,我想看到包的大小(KB或MB等)。NPM似乎没有显示这一信息。
我如何确定一个NPM包会给我的项目增加多少膨胀?
当我在NPM上搜索包时,我想看到包的大小(KB或MB等)。NPM似乎没有显示这一信息。
我如何确定一个NPM包会给我的项目增加多少膨胀?
当前回答
如果你正在使用webpack作为你的模块绑定器,请看看:
webpack-bundle-analyzer webpack-bundle-size-analyzer
我强烈推荐第一种选择。它在交互式树状图中显示大小。这可以帮助您找到打包文件中的包的大小。
这篇文章中的其他答案向你展示了项目的规模,但你可能不会使用项目的所有部分,例如摇树。其他方法可能无法显示准确的大小。
其他回答
你可以查看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);
});
它可能看起来有点啰嗦,但它解决了您恰当描述的问题。
一个“快速而肮脏”的方法是使用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 download size,它可以检查给定npm包的tarball大小,包括依赖树中的所有tarball。这可以让您了解预先添加依赖项的成本(安装时间、磁盘空间、运行时资源、安全审计……)。
在上图中,Tarball size是package的tar.gz, Total size是所有Tarball的大小。这个工具非常基本,但它做到了它所说的。
还可以使用cli工具。你可以这样安装:
npm i -g download-size
像这样使用它:
$ download-size request
request@2.83.0: 1.08 MiB
源代码可在Github: api, cli工具和web客户端。