Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/siddharthkp/bundlesize below:

siddharthkp/bundlesize: Keep your bundle size in check

Keep your bundle size in check

npm install bundlesize --save-dev

# or

yarn add bundlesize --dev

Add it to your scripts in package.json

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

Or you can use it with npx from NPM 5.2+.

bundlesize accepts an array of files to check.

[
  {
    "path": "./build/vendor.js",
    "maxSize": "30 kB"
  },
  {
    "path": "./build/chunk-*.js",
    "maxSize": "10 kB"
  }
]

You can keep this array either in

1. package.json

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

   or in a separate file

2. bundlesize.config.json

   Format:

   {
     "files": [
       {
         "path": "./dist.js",
         "maxSize": "3 kB"
       }
     ]
   }

   You can give a different file by using the --config flag:

   bundlesize --config configs/bundlesize.json
   

1. Fuzzy matching

   If the names of your build files are not predictable, you can use the glob pattern to specify files.

   This is common if you append a hash to the name or use a tool like create-react-app/nextjs.

   {
     "files": [
       {
         "path": "build/**/main-*.js",
         "maxSize": "5 kB"
       },
       {
         "path": "build/**/*.chunk.js",
         "maxSize": "50 kB"
       }
     ]
   }

   It will match multiple files if necessary and create a new row for each file.

2. Compression options

   By default, bundlesize gzips your build files before comparing.

   If you are using brotli instead of gzip, you can specify that with each file:

   {
     "files": [
       {
         "path": "./build/vendor.js",
         "maxSize": "5 kB",
         "compression": "brotli"
       }
     ]
   }

   If you do not use any compression before sending your files to the client, you can switch compression off:

   {
     "files": [
       {
         "path": "./build/vendor.js",
         "maxSize": "5 kB",
         "compression": "none"
       }
     ]
   }

If your repository is hosted on GitHub, you can set bundlesize up to create a "check" on every pull request.

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

• Authorize bundlesize for status access, copy the token provided.
• Add this token as BUNDLESIZE_GITHUB_TOKEN as environment parameter in your CIs project settings.

You will need to supply an additional 5 environment variables.

• CI_REPO_OWNER given the repo https://github.com/myusername/myrepo would be myusername
• CI_REPO_NAME given the repo https://github.com/myusername/myrepo would be myrepo
• CI_COMMIT_MESSAGE the commit message
• CI_COMMIT_SHA the SHA of the CI commit, in Jenkins you would use ${env.GIT_COMMIT}
• CI=true usually set automatically in CI environments

(Ask me for help if you're stuck)

bundlesize can also be used without creating a configuration file. We do not recommend this approach and it might be deprecated in a future version.

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

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

⭐ this repo

• CONTRIBUTING.md

• bootstrap
• lighthouse
• styled-components
• emotion
• glamorous
• Popper.js
• react-apollo
• hyperapp
• css-constructor
• redux-saga
• micromodal
• unistore
• ngxs

• Work with other CI tools
  • AppVeyor (#234)
• Automate setup (setting env_var)

• BuildSize - GitHub App, no manual configuration required
• travis-weigh-in - Uses Python rather than Node.js
• size-limit - Uses webpack, builds your files for you.

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

MIT © siddharthkp

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4