TypeScript icon, indicating that this package has built-in type declarations

2.0.2 • Public • Published

Nx SizeLimit Plugin

An easy way to plug size-limit into your nx powered projects.

Nx Ngrok package on NPM Nx Ngrok package downloads on NPM

Size Limit is a performance budget tool for JavaScript. It checks every commit on CI, calculates the real cost of your JS for end-users and throws an error if the cost exceeds the limit.

install plugin

npm install -D nx-size-limit

Install size-limit presets

npm install -D size-limit @size-limit/preset-app

** Read Usage section


** Requires a prior build of the target project.

Configure size-limit

nx g nx-size-limit:add --name=your-project


Name Type Required Default Description
name string The name of the target project.
projectsDir string - apps The name of the project host directory. Typically apps/libs/packages.
bundler string - webpack The name of the bundler used when building the target project.
nx g nx-size-limit:add --name=your-lib --projectsDir=libs --bundler=vite

When running the nx-size-limit:add generator a new .size-limit.json config will be generated in your project root folder.

The default config contains the relative path to your main bundle and the limited size of it.

    "path": ["../../dist/apps/your-project/main*.js"],
    "limit": "300 kB"

Read more on the size-limit CLI configuration options here.

Additional executor will be added to the target project.json config:

  "size-limit": {
    "executor": "nx-size-limit:size-limit"

Statoscope bundle analysis

Set why:true for forwarding the '--why' flag to the size-limit CLI.

  "size-limit": {
    "executor": "nx-size-limit:size-limit",
    "options": {
      "why": true

It will produce a nice report helps to analyze the bundle as specified on this section.

You will need to install @size-limit/esbuild-why or @size-limit/webpack-why depends on which bundler you are using (default is esbuild).

Run a limit check

nx run your-project:size-limit


This is an initial suggestion, iterate over the distributed projects and run size-limit.

- name: Get list of affected apps
  run: |
    APPS=( $(ls -1d dist/apps/*/ | xargs -n 1 basename) )
    echo "APPS=$APPS" >> $GITHUB_ENV

- name: Run NX command per app
    APPS: ${{ env.APPS }}
  run: |
    for app in $APPS; do
      npx nx run $app:size-limit


This plugin wouldn't be possible without the great teams behind these projects:

  • size-limit - Calculate the real cost to run your JS app or lib to keep good performance. Show error in pull request if the cost exceeds the limit.
  • Nrwl - The team behind Nx

Please show them your support! ❤️

Package Sidebar


npm i nx-size-limit

Weekly Downloads






Unpacked Size

12.9 kB

Total Files


Last publish


  • lironhazan