Basic bundle size tracking

.github/workflows/test.yml

@@ -25,3 +25,23 @@ jobs:
 
       - name: Run tsc
         run: npm run build
+
+      # - name: Get sizes
+      #   id: size
+      #   run: >-
+      #     echo -n 'data=' &&
+      #     cat dist/report.json | jq '.[0] | { size: .parsedSize, gz: .gzipSize, label: .label }' >> $GITHUB_OUTPUT
+
+      # - name: Comment size
+      #   if: github.event_name == 'pull_request'
+      #   uses: peter-evans/create-or-update-comment@v4
+      #   with:
+      #     issue-number: ${{ github.event.pull_request.number }}
+      #     body: |
+      #       Package size:
+      #       ${{ steps.size.outputs.data }}
+      - name: Summarize sizes
+        run: |
+          echo -n "File: " && cat dist/report.json | jq '.[0].label' >> $GITHUB_STEP_SUMMARY
+          echo -n "Size: " && cat dist/report.json | jq '.[0].parsedSize' >> $GITHUB_STEP_SUMMARY
+          echo -n "Gzip: " && cat dist/report.json | jq '.[0].gzipSize' >> $GITHUB_STEP_SUMMARY

package.json

@@ -18,6 +18,7 @@
     "ts-loader": "^9.5.1",
     "typescript": "^5.3",
     "webpack": "^5.90.0",
+    "webpack-bundle-analyzer": "^4.10.1",
     "webpack-cli": "^5.1.4"
   },
   "files": [

webpack.config.js

@@ -1,4 +1,5 @@
 const path = require('path')
+const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
 
 module.exports = {
   entry: './src/index.ts',
@@ -17,6 +18,12 @@ module.exports = {
       },
     ],
   },
+  plugins: [
+    new BundleAnalyzerPlugin({
+      analyzerMode: 'json',
+      generateStatsFile: true,
+    }),
+  ],
   resolve: {
     extensions: ['.ts'],
   },