Same contenthash, different asset content after running optimization plugins

[albertfdp]

Bug report

What is the current behavior?

Two different builds with different (for example) postcss configuration, result into an asset that has different content, but same [contenthash], and therefore same filename. This means that if you use a CDN which cached the previous file, and SRI, file integrity will fail.

I have opened the issue on NMFR/optimize-css-assets-webpack-plugin#56 but I actually think this might be a webpack bug, as it looks like a plugin is capable of changing the content of the file after this has calculated the contenthash.

If the current behavior is a bug, please provide the steps to reproduce.

I have created a reproduction repo in https://github.com/albertfdp/optimize-css-assets-plugin-contenthash

The repo uses the recommended configuration on https://github.com/webpack-contrib/mini-css-extract-plugin#minimizing-for-production

There are 2 webpack builds, A and B, the differences are:

new OptimizeCSSAssetsPlugin({
 cssProcessorOptions: {
  discardComments: { removeAll: true }
- reduceIdents: false,
- safe: true,
- zindex: false
 }
})

Additionally, I am using:

plugins: [
    new MiniCssExtractPlugin({
      filename: '[name].[contenthash].css',
      chunkFilename: '[name].[id].[contenthash].css'
    })
  ]

The resulting assets:

• https://github.com/albertfdp/optimize-css-assets-plugin-contenthash/blob/master/dist/A/styles.1.5c30da23589641e4b64a.css
• https://github.com/albertfdp/optimize-css-assets-plugin-contenthash/blob/master/dist/B/styles.1.5c30da23589641e4b64a.css

What is the expected behavior?

That the contenthash is computed after having run the optimization plugins.

Other relevant information:
webpack version: 4.10
Node.js version:
Operating System:
Additional tools: https://github.com/albertfdp/optimize-css-assets-plugin-contenthash/blob/master/package.json

[alexander-akait]

Because OptimizeCSSAssetsPlugin runs after MiniCssExtractPlugin, should be fixed in OptimizeCSSAssetsPlugin

[albertfdp]

How can it be fixed? Is it a bug in OptimizeCSSAssetsPlugin that should be calling webpack to recompute the contenthash?

As I understand, webpack is responsible for generating the filename provided to MiniCssExtractPlugin (using the [contenthash]), if plugins can change it later isn't it a problem in the lifecycle? Shouldn't it be computed as the last step in the build so plugins cannot mangle the content?

Thank you

[alexander-akait]

@albertfdp plugin should regenerate contenthash if they change content of file

[albertfdp]

Thanks for the answer, that makes sense now.

[albertfdp]

@evilebottnawi if I wanted to open a PR to fix that myself on the plugin, could you indicate me what is the exposed webpack hook to regenerate the contenthash?

[alexander-akait]

@albertfdp need resolve this issue webpack/loader-utils#112 and use this module for generate contenthash