I'm trying to use the compilation hash for asset/resource file names but no matter what I try it just generates a different hash for every file in the asset/resource output. The chunk file names all get the same and correct compilation hash.
For example, the main bundle files are all correct:
appbundle.42cf6539b0e35868deab.js
polyfillsbundle.42cf6539b0e35868deab.js
etc..
However, the images in the assets folder look like this, with different hashes. Is there a way to get them to match the compilation hash like the bundle chunks?
image1.ec620b3ff0d269c77f1b.svg
image2.984ca5bc273b4992cb6c.svg
etc..
Relevant webpack config:
output:
{
filename: '[name].[hash][ext]',
chunkFilename: '[name].[hash][ext]',
publicPath: './dist/',
path: path.resolve(__dirname, 'dist'),
assetModuleFilename: 'assets/[name].[hash][ext]'
}
...
module: {
rules:
[
...
{
test: /\.(eot|woff|woff2|ttf|png|jpg|gif|svg|ico)$/,
type: 'asset/resource'
},
...
]
}
But what are you trying to achieve?
You are getting a new hash per image file, because with asset/resource you asked Webpack to emit resources to separate files.
When you use [hash] placeholder, Webpack would generate a hash out of the filename. Since you have different filenames ~> different hashes.
If you want to add some random suffix per build to your resources, I'd do something like:
const seed = new Date().getTime() // or your generation strategy
module.exports = {
. . .
output:
{
. . .
assetModuleFilename: `assets/[name].${seed}[ext]`
}
...