No Parsed/Gziped sizes if there is build hash in output path

[martinkadlec0]

Issue description

If there as build hash in webpack's output path, I get following error from WBA:
Error parsing bundle asset "/xxx/app/dist/[hash]/app.js": no such file.

My webpack output config:

	output: {
		filename: '[name].js',
		path: path.join(__dirname, './dist/[hash]/'),
		publicPath: `${cdnPublicPath}[hash]/`,
		chunkFilename: '[name].js',
	},

This causes that there is no gziped/parsed size on the WBA page.

Technical info

• Webpack Bundle Analyzer version: 3.3.2
• Webpack version: 4.35.0
• Node.js version: 10.13
• npm/yarn version: npm 6.9
• OS: Mac OS Mojave

Debug info

How do you use this module? As CLI utility or as plugin?
Plugin

If plugin, what options were provided? (e.g. new BundleAnalyzerPlugin({ analyzerMode: 'disabled', generateStatsFile: true }))
No options

What other Webpack plugins were used?
webpack.DefinePlugin
CircularDependencyPlugin
FlowStatusWebpackPlugin
ExtractCssChunks
HtmlWebpackPlugin
SpriteLoaderPlugin

Demo repo

https://github.com/martinkadlec0/wba-build-hash

[valscion]

Are you able to create a reproduction repository so that some contributor or us could check this error?

[martinkadlec0]

Sure, there you go https://github.com/martinkadlec0/wba-build-hash

[valscion]

Ah ok, now I get it! Thank you, the reproduction repository helped.

This does seem to be a lack of a feature that could also be categorized as a bug. The crux is this webpack config:

output: {
    filename: '[name].js',
    path: __dirname + '/dist/[hash]/',
  },

and that webpack-bundle-analyzer uses the path as-is instead of using some version where the [hash] would've been replaced with what it was in the end.

[valscion]

So the problem is here:

webpack-bundle-analyzer/src/BundleAnalyzerPlugin.js

Lines 137 to 138 in 95d03b7

	default:
	return this.compiler.outputPath;

The issue is not present when generating stats JSON separately and using the CLI to open the reporter:

So we should figure out a way to get the bundle directory location from somewhere else than compiler.outputPath as that path has not been expanded by webpack. Hmm...

[valscion]

Damn, the outputPath inside the Stats object (https://webpack.js.org/api/stats/#structure) is also not expanded but instead has the same /wba-build-hash/dist/[hash]/" end... I wonder if we'll need to replace [hash] with the hash we have in the Stats object.

The docs would indicate that [hash] is the only special replacement there, so it should not be too big a can of worms 😅 https://webpack.js.org/configuration/output/#outputpath

[valscion]

Ooh nice: webpack/webpack#1648

EDIT: Hmm, but I wonder if it's possible for us to use this functionality, given we don't depend on webpack directly.. hmm hmm

[valscion]

I had time to create a proof of concept of fixing this issue in #304, but unfortunately I don't have more time right now to figure this out and I don't know when I would have time.

[martinkadlec0]

Thanks a lot for looking into it 👍

[Sysix]

Update on this issue?
I got the same problem wen using output: {..., chunkFilename: '[name].js?id=[chunkhash]' }

[valscion]

No updates

[Sysix]

I found out that loader-utils has a function to maybe resolve this problem: interpolateName
https://github.com/webpack/loader-utils#interpolatename

Sadly I'm not the pro webpack user, who can find the right line to edit.

[valscion]

This is the PR that I got started on that made some progress, but then got a bit stuck and uncertain if I was heading in the right direction: #304