vite bundlesize compare action

An action that compares 2 vite compilation stats files, and comments on the PR with a description of the difference

How to use it

In your application, ensure you output the stats.json, from `vite-bundle-analyzer'

// nuxt.config.ts
import { analyzer } from "vite-bundle-analyzer";

export default defineNuxtConfig({
  vite: {
    plugins: [
      analyzer({
        analyzerMode: "json",
      }),
    ],
  },
});

Then, in your action configuration, build both the head and the branch (in any way you see fit) and pass paths to the stats.json files as inputs ot this action

# .github/workflows/bundlesize-compare.yml

on:
  # this action will error unless run in a pr context
  pull_request:
  pull_request_target:

jobs:
  # Build current and upload stats.json
  # You may replace this with your own build method. All that
  # is required is that the stats.json be an artifact
  build-head:
    name: 'Build head'
    runs-on: ubuntu-latest
    permissions:
      contents: read
    steps:
      - uses: actions/checkout@v4
        with:
          ref: ${{github.event.pull_request.head.ref}}
      - name: Install dependencies
        run: npm ci
      - name: Build head stats for analyze bundle size
        run: npx nuxi build
      - name: Upload stats.json
        uses: actions/upload-artifact@v4
        with:
          name: head-stats
          path: .nuxt/dist/client/stats.json

  # Build base for comparison and upload stats.json
  # You may replace this with your own build method. All that
  # is required is that the stats.json be an artifact
  build-base:
    name: 'Build base'
    runs-on: ubuntu-latest
    permissions:
      contents: read
    steps:
      - uses: actions/checkout@v4
        with:
          ref: ${{ github.base_ref }}
      - name: Install dependencies
        run: npm ci
      - name: Build head stats for analyze bundle size
        run: npx nuxi build
      - name: Upload stats.json
        uses: actions/upload-artifact@v4
        with:
          name: base-stats
          path: .nuxt/dist/client/stats.json

  # run the action against the stats.json files
  compare:
    name: 'Compare base & head bundle sizes'
    runs-on: ubuntu-latest
    needs: [build-base, build-head]
    permissions:
      pull-requests: write
    steps:
      - uses: actions/download-artifact@v4
      - uses: shimizukawa/vite-bundlesize-compare-action@main
        with:
          github-token: ${{ secrets.GITHUB_TOKEN }}
          current-stats-json-path: ./head-stats/stats.json
          base-stats-json-path: ./base-stats/stats.json

This action requires the write permission for the permissions.pull-requests scope.

Options

name	description	required	type
current-stats-json-path	The path to the current stats.json file	true	string
base-stats-json-path	The path to the base stats.json file	true	string
github-token	The Github token	true	string
title	An optional addition to the title, which also helps key comments, useful if running more than 1 copy of this action	false	string

Example PR Comment

github#50 (comment)

License

shimizukawa/vite-bundlesize-compare-action

ErrorLooks like something went wrong!

About

Resources

License

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Languages

Error
Looks like something went wrong!

Packages