How do I view the size of npm packages?
What you probably want to measure is the impact of the package if you add it to your application package. Most of the other answers will only estimate the size of the source files, which may be inaccurate due to inline comments, long variable names, etc.
I made a little utility that will tell you the minimum + gzip size of a package after it gets into your package -
source to share
Take a look at this cost-of-modules project . This is an npm package that will list the package size and the number of children.
Installation:
npm install -g cost-of-modules
Usage: Run cost-of-modules
in the directory you are working in.
source to share
I created a tool, npm download size , that checks the tarball size for a given npm package, including all tarballs in the dependency tree.
In the image above, the Tarball size is the tar.gz package and the Total size is the size of all tarballs. The tool is pretty basic, but it does what it says.
Cli tool is also available. You can install it like this:
npm i -g download-size
And use it like this:
$ download-size request
request@2.83.0: 1.08 MiB
Here is a demo of asciinema .
Source code is available on Github: API , Cli tool, and web client .
source to share
I created Package Phobia earlier this year with the hopes of getting information about the package size on npmjs.com and also tracking package distribution times.
It is designed to measure disk space after startup npm install
for server dependencies like express
or dev like jest
.
You can read more about this tool and other similar tools in the readme here: https://github.com/styfle/packagephobia
Note. Even though the npm team is not trying to change the website, they are considering adding a set size to the cli. See RFC 1 for more information.
source to share
In case you are using webpack as your module module take a look at:
I would definitely recommend the first option. Shows the size in an interactive tree map. This will help you find the package size in your file.
The other answers in this post show you the size of the project, but you may not use all parts of the project, for example with tree shake. Then other approaches may not show you the exact size.
source to share
If you are using Visual Studio Code, you can use an extension called Import Cost .
This extension will display the size of the imported package inline in the editor. The extension uses webpack with the babili-webpack-plugin to determine the imported size.
source to share
You can check npm-module-stats . This is an npm module that gets the size of an npm module and its dependencies without installing or downloading the module.
Using:
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);
});
This may sound a little verbose, but it solves the problem you described appropriately.
source to share
The "quick and dirty" way is to use curl and wzrd.in to quickly download the minified package and then grep the file size
curl -i https://wzrd.in/standalone/axios@latest | grep Content-Length
The download is a thumbnail but not gzipped, but you get an idea of the relative size of the packages when comparing two or more of them.
source to share