element ui 图片加载失败_【Vue】解决部署到服务器后Element UI图标不显示问题（404错误）...

问题描述：开发环境正常，但是打包上线后，字体文件无法加载

1.查看网络请求可以看到如下两个字体文件加载不到：

http://localhost:59090/static/css/static/fonts/element-icons.535877f.woff

http://localhost:59090/static/css/static/fonts/element-icons.732389d.ttf

2.问题原因

查看 /build/webpack.base.conf.js 文件可以发现，woff 或 ttf 这些字体会经由 url-loader 处理后在 static/fonts 目录下生成相应的文件。

也就是说实际应该通过 /static/fonts/** 路径来获取字体图标，而实际却是请求 /static/css/static/fonts/**，自然报 404 错误。

3.解决办法

打开 build/utils.js 文件，在如下位置添加 publicPath: '../../'

修改完毕后重新 build 发布，可以发现图标已经可以正常显示了。