Keep your bundle size in check
JavaScript HTML CSS
Latest commit c7cb493 Sep 20, 2017 @reznord reznord committed on GitHub Merge pull request #147 from opencollective/opencollective
Activating Open Collective

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  

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?

 

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].

Backers

Thank you to all our backers! 🙏 [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]

license

MIT © siddharthkp

sponsor

Sponsor