问题描述：
vue2+element-ui 的项目，本地看没有问题，打包部署后 element-ui 自带的 icon 图标显示乱码
问题原因：
查看打包后生成的 dist/css/app.xxx.css 文件，发现乱码的图标部分变成了 .el-icon-ice-cream-square:before{content:“”}
问题解决：
-
sass 版本升级到 1.39.0
npm install sass@1.39.0，也可直接修改 package.json 中 sass 的版本号然后重新npm install -
vue.config.js 增加 sass 配置文章来源：https://www.toymoban.com/news/detail-518471.html
devServer: {
port: port,
open: true,
overlay: {
warnings: false,
errors: true
},
proxy: {
'/api': {
target: '',
ws: true, // proxy websockets
pathRewrite: {
'^/api': '/'
}
}
},
disableHostCheck: true,
},
css: {
loaderOptions: {
sass: { // 这里开始是新增的配置
sassOptions: {
outputStyle: 'expanded'
}
}
}
},
然后重新打包就可以了文章来源地址https://www.toymoban.com/news/detail-518471.html
到了这里，关于解决 element-ui 打包后 icon 图标乱码问题的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
