为什么 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字段以匹配您的所有字体。