爲什麼webpack會創建奇怪的字體文件？

Question

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

76a4f23cb373829c9382900d9dfs9830sdf.svg

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

問題是每當我們生成一個新的包時，這些文件就會在github中累積。有沒有辦法強制webpack使用這些文件的特定名稱？

Answer 1

是的，你是對的。這是一個散列。

默認情況下，加載帶有file-loader的字體文件所產生的文件名是文件內容的MD5哈希，並具有所需資源的原始擴展名。

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

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

例如，如果要將此模板應用到svg文件：

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

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