关于qiankun微前端项目的问题总结

前期配置参考

我写的主应用是vue2.0,微应用是vue3.0, 前期配置参考 时注意初始化项目时必须要将vue-router加入到项目中不然可能会出现以下问题

1、export ‘default‘ (imported as ‘VueRouter‘) was not found in ‘vue-router‘

2、 Object.defineProperty called on non-object

3、export ‘createWebHistory, createRouter‘ was not found in ‘vue-router‘

出现这些问题的原因无非就是你的vue-router版本与当前你的项目中某些东西不兼容导致的，只用在初始化的时候用整的一套，基本就不会出问题了

后面想模拟下部署到线上的操作，于是在本地起了两个express服务（本地启用express服务参考这个注意这个操作前提是要全局安装好express【npm install express -g】），一个用于主应用，一个用于微应用，然后将我的主应用和微应用分别打包后，丢到不同的express服务中的public文件夹下测试效果，结果不出所料遇到跨域问题

Access to fetch at 'http://localhost:7001/' from origin 'http://localhost:30......

于是去到express项目中的app.js文件末尾处修改跨域配置 Access-Control-Allow-Origin

app.all('*', function (req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  res.header('Access-Control-Allow-Methods', '*');
  res.header('Content-Type', 'application/json;charset=utf-8');
  next();
});

结果发现不行，试了半天，最后尝试性的将这段代码写到文件的开头位置，很好终于可以了（一脸懵逼中）