css - 网页包 4 : naming the CSS files

Question

在命名用 MiniCssExtractPlugin 生成的 CSS 文件时，有两种不同的命名方式建议:

第一个例子:

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

第二个例子:

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

哪种方法是首选方法，为什么？

Answer 1

[contenthash] 优于 [hash]。 Contenthash 是根据文件内容生成的哈希值，因此它只会在您对该文件进行更改时发生变化。这有助于整体现金(或什至更好:“静态内容的长期缓存”)。

鉴于您更新了一个文件并且您正在使用 contenthash 以外的其他东西，用户将无法看到任何更新(需要删除现金)。 Contenthash 是一种更好的自动化版本:

app.js?build=1
vendor.css?build=1
main.css?build=1

TL;TR:适合缓存，只有在内容更改时才会更新，有助于长期缓存等。