How to use size-limit package?

Question

I have installed the npm package size-limit to monitor the size of my application. Following their documentation, I've written this in my package.json:

  "scripts": {
    "size": "size-limit"
  },
  
  "size-limit": [
    {
      "path": "./src/index.tsx",
      "limit": "120 KB"
    }
  ],

But when running yarn size I receive the following error:

/bin/sh: size-limit: command not found.

Weird. When directly running yarn size-limit I have:

error Command "size-limit" not found.

How to fix this?

Answer 1

Ran into the same error while trying to run yarn size for a React app. Solved it by installing size-limit and @size-limit/preset-app as dev dependencies:

yarn add size-limit @size-limit/preset-app --dev

Then:

1. add size-limit as a configuration in package.json
2. add the size script

(Just like you've done, but my path is build/static/**/*.{js,css,svg,woff,woff2,png,ttf,html})

{
...
 "size-limit": [
    {
      "path": "..."
    }
  ],
  "scripts": {
    ...
    "size": "yarn build && size-limit"
  }
...
}

Reference:

• https://www.npmjs.com/package/size-limit/v/0.19.3
• https://medium.com/@eferhatg/create-react-app-continuous-integration-config-with-circleci-and-aws-2b0238cde169

Running yarn size now works: