index.js 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. /**
  2. * qiankun配置
  3. */
  4. import {registerMicroApps, setDefaultMountApp, start, runAfterFirstMounted, addGlobalUncaughtErrorHandler} from 'qiankun';
  5. import {apps} from './apps';
  6. import {getProps, initGlState} from './state';
  7. /**
  8. * 重构apps
  9. */
  10. function filterApps() {
  11. apps.forEach((item) => {
  12. //主应用需要传递给微应用的数据。
  13. item.props = getProps();
  14. //微应用触发的路由规则
  15. item.activeRule = genActiveRule('/' + item.activeRule);
  16. });
  17. return apps;
  18. }
  19. /**
  20. * 路由监听
  21. * @param {*} routerPrefix 前缀
  22. */
  23. function genActiveRule(routerPrefix) {
  24. return location => location.pathname.startsWith(routerPrefix);
  25. }
  26. /**
  27. * 微应用注册
  28. */
  29. function registerApps() {
  30. const _apps = filterApps();
  31. registerMicroApps(_apps,
  32. {
  33. beforeLoad: [
  34. loadApp => {
  35. console.log('before load', loadApp);
  36. }
  37. ],
  38. beforeMount: [
  39. mountApp => {
  40. console.log('before mount', mountApp);
  41. }
  42. ],
  43. afterMount: [
  44. mountApp => {
  45. console.log('before mount', mountApp);
  46. }
  47. ],
  48. afterUnmount: [
  49. unloadApp => {
  50. console.log('after unload', unloadApp);
  51. }
  52. ]
  53. });
  54. // 设置默认子应用,与 genActiveRule中的参数保持一致
  55. // setDefaultMountApp();
  56. // 第一个微应用 mount 后需要调用的方法,比如开启一些监控或者埋点脚本。
  57. runAfterFirstMounted(() => console.log('开启监控'));
  58. // 添加全局的未捕获异常处理器。
  59. addGlobalUncaughtErrorHandler(event => console.log(event));
  60. // 定义全局状态
  61. initGlState();
  62. //启动qiankun
  63. start({});
  64. }
  65. export default registerApps;