[Question] Combining statistics into one file (displaying on the same port) for multiple webpack configurations

Katerina198b commented 1 year ago

Issue description

I use multiple webpack configurations for my component library. It means I have a bundle for each component. I want to see an overall picture of bundle side for all of that components in one place. For now, I've found only one opportunity to open BundleAnalyzer for each component

Question: Is it possible to join all outputs (for each component) into one stats.json (or host it in one place)? For now, I have:

Couldn't read webpack bundle stats from "../build/stats.json":
SyntaxError: Unexpected token > in JSON at position 1

Technical info

System:
    OS: macOS 12.1
    CPU: (10) x64 Apple M1 Pro
    Memory: 1.56 GB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.20.0 - ~/.nvm/versions/node/v14.20.0/bin/node
    npm: 8.19.2 - ~/.nvm/versions/node/v14.20.0/bin/npm
  npmPackages:
    clean-webpack-plugin: ^3.0.0 => 3.0.0 
    copy-webpack-plugin: ^10.2.4 => 10.2.4 
    css-minimizer-webpack-plugin: ^2.0.0 => 2.0.0 
    fork-ts-checker-webpack-plugin: ^6.1.0 => 6.5.2 
    html-webpack-plugin: ^5.5.0 => 5.5.0 
    optimize-css-assets-webpack-plugin: ^6.0.1 => 6.0.1 
    terser-webpack-plugin: ^5.3.1 => 5.3.6 
    webpack: ^5.72.0 => 5.74.0 
    webpack-bundle-analyzer: ^4.6.1 => 4.6.1 
    webpack-cli: ^4.9.2 => 4.10.0 
    webpack-dev-server: ^3.11.2 => 3.11.3

Debug info

How do you use this module? As CLI utility or as plugin? - I'm trying both

CLI

build:webpack: webpack --config ./configuration/webpack.config.js,
npm run build:webpack -- --profile --json > build/stats.json

plugin

new BundleAnalyzerPlugin({
    analyzerMode: 'server',
    analyzerPort: 0,
    generateStatsFile: true,
}),

valscion commented 1 year ago

Hi! Thanks for adding all this context to the issue description ☺️

I think, but haven't confirmed, that the way you're trying to do this with outputting the stats.json should work.

Looking at the error you have:

Couldn't read webpack bundle stats from "../build/stats.json":
SyntaxError: Unexpected token > in JSON at position 1

it looks like the ../build/stats.json file starts with something that isn't JSON.

Maybe that file contains some extra output before the stats JSON itself? I wonder if:

npm run build:webpack -- --profile --json

outputs something in the beginning before the JSON itself and that will in turn get stored to the build/stats.json file.

It seems that the --json option when given to webpack CLI will directly support passing the file as a path for the output file: https://webpack.js.org/api/cli/#json

Can you test if this would work?

build:webpack: webpack --config ./configuration/webpack.config.js,
npm run build:webpack -- --profile --json build/stats.json

valscion commented 1 year ago

I'm going to close this as I haven't heard back from you. We can reopen if there indeed is something that is not working as expected ☺️

webpack-contrib / webpack-bundle-analyzer