hbuilderX打包vue项目白屏问题以及element-ui的icon图标无法正常显示问题

本文主要是介绍hbuilderX打包vue项目白屏问题以及element-ui的icon图标无法正常显示问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

附录一：hbuilderX打包vue项目白屏问题

将项目目录下的config文件夹里的index.js文件中,将build对象下的assetsPublicPath中的“/”，改为“./”后，再打包生成的 dist 文件
build: {
// assetsPublicPath: '/',//修改前
assetsPublicPath: './',//修改后
}

附录二element-ui的icon图标无法正常显示问题：hbuilderX打包vue项目

问题：使用vue-cli3脚手架搭建的项目，在打包文件上服务器的时候，其他的css，js样式都能正确加载出路径，
但是element的icon图标却不能正常加载出来。

问题分析：
加载的路径https://yxq.linksign.cn/static/css/static/fonts/element-icons.535877f.woff
本应该加载的路径https://yxq.linksign.cn/static/fonts/element-icons.535877f.woff
打包的路径
事实上是打包时候读取的文件路径多了两层；
找到build文件的utils.js 中有打包的路径，看看generateLoaders();
Extract CSS when that option is specified, 指定该选项时提取CSS
发现少了个公共路径，加上pubilcPath
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
// 解决icon路径加载错误
publicPath:'../../'
})
} else {
return ['vue-style-loader'].concat(loaders)
}