Question

Module not found: Error: Can't resolve '../fonts/fontawesome-webfont.eot'

我正在尝试使用webpack设置字体真棒。我遇到了以上错误。

这是我的webpack.common.js文件：

{
                test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'file-loader'
            },
            {
                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'url-loader?limit=10000&mimetype=application/font-woff'
            }

一旦我导入：

@import '~font-awesome/scss/font-awesome.scss';

找不到很多模块。我确定我安装了font-awesome-sass-loader，css-loader，url-loader，file-loader。

有人可以提示我我想念什么吗？谢谢。

Answer 1

在我的HTML Starter中，我使用的file-loader具有类似的Webpack配置：

{
   test: /\.(woff(2)?|ttf|eot)(\?[a-z0-9=.]+)?$/,
   loader: 'file-loader',
   options: {
      outputPath: 'fonts',
      name: '[name].[ext]',
   },
   exclude: /node_modules/,
}

但是我还必须在MiniCssExtractPlugin。loader中配置publicPath：

{
   loader: MiniCssExtractPlugin.loader,
   options: {
      publicPath: '../',
   }
},

我用了resolve-url-loader

这是我为字体文件添加加载程序的承诺： https://github.com/cichy380/html-starter-bs4-webpack/commit/285604e0cdcd3ff16ba88fe482f21ad77355ef87

使用webpack设置字体真棒

1 个答案: