MiniCssExtractPlugin 中的字体路径错误答案

【问题标题】：Wrong path to font in MiniCssExtractPluginMiniCssExtractPlugin 中的字体路径错误
【发布时间】：2020-06-06 22:49:44
【问题描述】：

我有一个 404 错误，因为字体路径错误。现在是 dist/font ，但页面尝试在 dist/style/font 找到它。

这是我的配置 jsfiddle.net/sicely/z8g5sr9e

我是这样导入字体的

@font-face {
    font-family: 'Roboto-Bold';
    src: url(../assets/fonts/Roboto-Black.ttf) format("truetype")
}

如果我把我所有的包都放在根目录下，一切正常

【问题讨论】：

你能创建一个小 github repo（不是整个项目）来看看有什么问题吗？
@Legends 问题已解决，感兴趣的请在下方回答。感谢您的帮助。你可以像我一样创建一个答案，我接受它。因为我延迟了2天。

标签： javascript webpack bundle bundler

【解决方案1】：

        {
            test: /\.(ttf|woff)$/,
            use: {
                loader: 'file-loader',
                options: {
                    name: 'fonts/[name].[hash:6].[ext]',
                    publicPath: '../',
                },
            },
        }

如果我将 publicPath 添加到文件加载器选项，问题就解决了

【讨论】：