webpack 问题 "downloadable font rejected by sanitizer"或 "failed to decode downloaded font"

Question

我遇到了一个众所周知的问题，但没有明确的解决方案:webpack 的以下设置(在 Symfony 中再次设置)产生错误 downloadable font: rejected by sanitizer ...在 Firefox 和 failed to decode downloaded font 中在 Edge 中为一些(不是全部!)@fontawesome 字体和 IPM Plex Mono(我通过 npm 安装)

.addLoader(
    {
        test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
        use: [
            {
                loader: 'file-loader',
                options: {
                    name: "[name].[ext]",
                    outputPath: "./fonts"
                }
            }
        ]
    })

我已经尝试了我可以在 stackoverflow、github 和其他站点上找到的所有内容。不是另一个加载程序(url-loader)，不是修改 outputPath 或设置 publicPath，也不是其他任何帮助。错误保持不变。导入都很好，因为 webpack 没有编译错误。没有 webpack 配置的这一部分，一切也都很好。网络服务器正确提交文件并访问 URL 以直接下载有效的字体文件。因此，路径和其他任何东西似乎都没问题。所以……这里有什么问题？
问题出现在 Firefox、Chrome 和 Edge(每个都是最新版本)中。
知道如何解决这个问题吗？

Answer 1

在玩了很多我在网上找到的解决方案之后，这对我来说似乎是一个:

.copyFiles({
    from: './assets/images',
    to: 'images/[path][name].[hash].[ext]',
})
.configureFilenames({
    images: 'images/[name].[hash].[ext]',
    fonts: 'fonts/[name].[hash].[ext]',
})

解释:当然，webpack 必须从 vendor 那里复制文件。通过这样做，它在大多数情况下都失败了，因为散列中的错误(我猜)。通过正确交换/添加散列，某些 vendor 文件中的 URL 未正确更改。至少这是我的猜测。
我试过 [hash:6]和 [hash:8]以及简单地忽略散列(如我的问题所示)。一个缩短的成功了，其他的失败了。其他配置(不同的加载器或插件)根本没有帮助。然后我偶然设置了完整的哈希值和...bazinga!所以，最后，我不知道所有失败的真正原因，但至少我现在知道如何解决这个问题:简单地告诉 webpack 通过保留完整的哈希来复制和重命名文件，就是这样。