Webpack bundle size debugging
tl;dr: A tiny script to list all files that are bundled together by Webpack. It’s useful to track unexpected external dependencies, internal libraries, SVG icons, or just plain JavaScript that’s not tree-shaken away.
Run with powershell -file ./report.ps1 > report.txt
on the output of the Webpack Bundle Analyzer.
# report.ps1
$json = get-content report.json | convertfrom-json
function traverse($node) {
if ($node -eq $null) {
return
}
write-host "$($node.path) $($node.label) $($node.parsedSize / 1024)" # KB
$node.groups | foreach-object {
traverse($node)
}
}
traverse($json)