Keep your bundle size in check
JavaScript HTML CSS

README.md



Keep your bundle size in check

 

Build Status Backers on Open Collective Sponsors on Open Collective Greenkeeper badge NPM Version js-standard-style Join us on Slack

NPM Downloads  

sponsor

Sponsor

 

minimal setup

npm install bundlesize --save-dev

 

usage

Add it to your scripts in package.json

"scripts": {
  "test": "bundlesize"
}

 

Or you can use npx with NPM 5.2+.

npx bundlesize

configuration

 

1) Add the path and gzip maxSize in your package.json

{
  "name": "your cool library",
  "version": "1.1.2",
  "bundlesize": [
    {
      "path": "./dist.js",
      "maxSize": "3 kB"
    }
  ]
}

bundlesize also supports glob patterns

Example:

"bundlesize": [
  {
    "path": "./dist/vendor-*.js",
    "maxSize": "3 kB"
  },
  {
    "path": "./dist/chunk-*.js",
    "maxSize": "3 kB"
  }
]

This makes it great for using with applications that are bundled with another tool. It will match multiple files if necessary and create a new row for each file.

 

2) build status

build status

Currently works for Travis CI, CircleCI, Wercker, and Drone.

(Ask me for help if you're stuck)

 

CLI

example usage:

bundlesize -f "dist/*.js" -s 20kB

For more granular configuration, we recommend configuring it in the package.json (documented above).

 

like it?

⭐️ this repo

 

how to contribute?

 

Featured on Totally tooling tips!

totally tooling tips

 

who uses bundlesize?

 

TODO

  • Work with other CI tools (AppVeyor, etc.)
  • Automate setup (setting env_var)

 

similar projects

Contributors

This project exists thanks to all the people who contribute. [Contribute].

license

MIT © siddharthkp