How to name css file with hashed name, just like a js file?

Question

In webpack, I can make bundle to be named as hash, like this:

output: {
    path: resolvePath('dist'),
    filename: '[name].[contenthash].js'
  },

This generates files like:

34.9e884d9e0051cf81aff5.js
bundle.936eb50aa67577f751e6.js
vendors.df56297c28c1d1017f2a.js

But css files are not getting hashed they remain:

bundle.css

The problem comes when I am using caching in my server and changes are not getting applied since css files are not getting renamed.

How to tell webpack to create something like 9e884d9e0051cf81aff5.bundle.css ?

Grzegorz T. · Accepted Answer · 2019-08-01 22:49:36Z

1

I suppose you're using this mini-css-extract-plugin?

new MiniCssExtractPlugin({
 filename: '[contenthash].bundle.css'
}),

answered Aug 1, 2019 at 22:49

Grzegorz T.

4,2182 gold badges14 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1