Webpack為什么會創建奇怪的字體文件？

Question

每次我運行webpack時，似乎都會輸出一組新的字體文件。 它們總是以一長串隨機字符（例如哈希）命名。 例如，

76a4f23cb373829c9382900d9dfs9830sdf.svg

有.eot，.woff，.woff2等文件。

問題是每次我們生成新包時，文件就會在github中累積。 有什么方法可以強制Webpack為這些文件使用特定名稱？

Answer 1

是的，你是對的。 這是一個哈希。

默認情況下，使用文件加載器加載字體文件所得到的文件名是文件內容的MD5哈希值，具有所需資源的原始擴展名。

如果需要，可以使用查詢參數name為文件配置自定義文件名模板。 您可以在字體加載器規則中使用以下模板指定保留相同的路徑，名稱和擴展名：

'file-loader?name=[path][name].[ext]'

例如，如果您想將此模板應用於svg文件：

loader: [
  { test: /.svg$/, loader: 'file-loader?name=[path][name].[ext]' }
]

相應地修改test字段以匹配所有字體。