项目场景:
elementui图标打包后部分显示部分不显示
问题描述
GET http://xxxx/dist/202207111030/static/css/static/fonts/element-icons.535877f.woff net::ERR_ABORTED 404 (Not Found) app.css:1 GET http://xxxx/dist/202207111030/static/css/static/fonts/element-icons.732389d.ttf net::ERR_ABORTED 404 (Not Found)
原因分析:
这里的limit配置项会指定文件大小,小于limit的图片无法生成图片并以base64格式被引入,大于limit的图片将以url加载
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
解决方案:webpack.base.conf.js配置文件中的module.exports下module的rules,其中woff格式引入如下:
10000
改为100000