第一步、跨域解决
后端解决跨域:
1、gateway 验证码 spring响应式 webflux 跨域解决
2、springmvc restfull 请求跨域解决 修改gateway nacos中的配置
前端解决跨域(主应用、子应用都添加)
第二步、主应用安装无界以及代码修改
前端安装无界(只需要主应用安装)
npm i wujie-vue2 -S
前端引用无界(只需要主应用引入)
获取路由参数写死(主应用)
主应用添加子应用统一跳转页面(vueTwo.vue):
第三步、子应用代码修改
第四步、后端System 模块获取路由代码修改
1、 添加应用管理
2、 菜单管理添加所属应用 ,区分主、子应用目录菜单
3、 路由加载策略区分微前端架构,和单独子应用逻辑不做文字描述。
代码关键点1:分组子应用加载路由,保证子应用能单独开发
代码关键点2:
四步完成后微前端集成完成,效果如下。
额外子应用菜单中有默认参数讲解,eg:通用查询所带的