不要让你的 bundles 超重

Source: Dev.to

什么是 Overweight？

Overweight 是一个现代的、零配置的 CLI，允许你为构建产物定义大小预算。如果任何文件超过了其预算，Overweight 会抛出错误，使你的 CI 流程失败。

安装与使用

你可以直接使用 npx 运行 Overweight：

# 基本用法
npx overweight --file "dist/*.js" --max-size 50kb

# 指定压缩类型
npx overweight --file "dist/*.js" --max-size "15 kB" --compression brotli

如果你更喜欢本地安装：

pnpm add -D overweight
pnpm overweight

配置

在 package.json 中添加 overweight 部分，或创建独立的 overweight.config.json 文件。下面是一个真实场景的示例，混合了不同的压缩类型和应用不同部分的限制：

{
  "checks": [
    {
      "path": "build/static/js/main.*.js",
      "maxSize": "150kb",
      "compression": "brotli"
    },
    {
      "path": "build/static/js/chunk-*.js",
      "maxSize": "50kb",
      "compression": "gzip"
    },
    {
      "path": "build/static/css/*.css",
      "maxSize": "20kb",
      "compression": "none"
    }
  ]
}

使用配置好的预算运行检查：

npx overweight

CI 集成

Overweight 在 CI 中表现出色，可阻止导致应用体积膨胀的 Pull Request。下面是一个可直接使用的 GitHub Action 工作流，运行于 PR 和 main 分支的推送：

name: bundle-overweight-test

on:
  pull_request:
  push:
    branches: [main]

jobs:
  overweight:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: yoavniran/overweight@v1
        with:
          config: overweight.json
          update-baseline: true
          report-file: overweight-report.json
          github-token: ${{ secrets.GITHUB_TOKEN }}

• 如果文件超过了允许的大小，作业会失败。
• 当 update-baseline 为 true 且报告因大小或配置更新而变化时，action 会创建一个单独的 PR 来更新报告文件。

特性

• 现代默认 – 为当今的 CI 环境而构建。
• 灵活配置 – 支持 glob 模式、每文件的压缩设置（Brotli、Gzip 或 none）。
• 零配置 CLI – 无需提交配置文件即可尝试。
• 可靠的 CI – 与 GitHub Actions 无缝配合。

入门

试试 Overweight，摆脱对包体积增长的担忧。

在 GitHub 上查看 Overweight – 如果你喜欢它，考虑给它点个 ⭐️。