Element-ui框架：前端打包部署后部分图标不显示或者显示为小方块的问题

一、问题如下

　　vue前端项目引入element-ui框架后，本地运行图标正常显示，但打包部署后部分图标不显示。

　　

二、问题解决

　　1.问题分析

　　由于本地运行时图标可以正常显示且在打包部署后部分图标也能够正常显示，说明dev和build的配置引用路径应该是没有问题。

　　从部分图标依旧可以正常显示来看，问题应该出在这部分图标和无法显示图标的差异上，找到引入外部文件的规则。

　　webpack.base.conf.js配置文件中的module.exports下module的rules,其中woff格式引入如下：

　　

　　这里的limit配置项会指定文件大小，小于limit的图片无法生成图片并以base64格式被引入，大于limit的图片将以url加载。

　　无法正常显示的部分图标可能是因为limit大小限制，调整为100000后重新打包部署。

　　2.处理结果：

　　

　　注：目前配置大小限制、外部文件引入路径和框架版本问题都有可能引起图标不显示，所以具体情况还得具体分析，此处只是其中一种。