引言:qiankun 是一个基于 single-spa 的微前端实现库,旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。
问题描述:在用qiankun搭建的主应用导入子应用时,子应用中使用的element-ui的图标无法显示(小方框),但是在子应用中时可以正常显示的。看控制台有报如下错误:
注:8090为主应用端口
原因及解决方案:
1、原因:路径不对。因为主应用和子应用存在跨域的问题,当在主应用去请求子应用element-ui图标文件时地址是主应用的地址;
2、解决方案:在主应用的配置文件中配置子应用地址代理。简单配置如下:
注:vue.cli3.0+ 的项目在vue.config.js下配置;以下的版本在webpack.dev/prod.conf.js下配置(具体哪个文件看要配置的环境)。这边proxy配置写的比较简单,有其他需求可丰富配置。