苦海学说

Personal Blog
Exchange Learning

Element在线上部分icon图标显示乱码

线上产品发布会发现部分element icon显示乱码

使用开发者工具查看发现,使用element ui icon的class会生成一个伪类,但是它的content全部是一个乱码,并不是我们熟知的"E6DF"等字符。

于是我们会怀疑是不是我们的字体未打包,因为我们要实现主题可以换或者主题色变更,会使用element的自定义主题的sass文件修改并引入node_modules中的element index.css到项目中。

@import "~element-ui/packages/theme-chalk/src/index";

但是我发现构建的静态文件是完整的,于是我网上查询发现,element的sass是使用node-sass,而我们的node_modules中sass安装的是dart,所以需要先卸载之前的sass,安装node-sass版本

npm uninstall sass
npm install node-sass -D

安装完成后,重新打包发现伪类的content正常了,然后就可以重新部署发布了。

本原创文章未经允许不得转载 | 当前页面:苦海学说 » Element在线上部分icon图标显示乱码

评论