SWS微应用适配器

用于快速接入SWS管理系统的微应用适配器

快速上手

安装

$ npm install sws-micro-app-adapter

使用

import {isMicroAppEnvironment, mountApp, unmountApp} from "sws-micro-app-adapter";

if (isMicroAppEnvironment()) {
    mountApp(() => {
      // 初始化APP
    })
    unmountApp(() => {
      // 卸载APP
    })
} else {
    // 初始化APP
}

常见问题

1.ElementUI冒泡系列组件（比如下拉框）弹出位置不正确

原因：ElementUI采用了popper.js2.0 版本，这个版本计算位置会递归元素一直计算到window.visualViewport，但是子应用的dom挂载在shadowRoot上，并没有window.visualViewport这部分滚动量，导致偏移计算失败。

解决方案：将子应用将body设置为position: relative即可，如果还是不行的话，可以给用到冒泡系列组件的地方添加样式

.el-popper {
  position: absolute !important;
}

2. 静态资源路径问题

可以通过运行时动态设置webpack.publicPath来解决静态资源路径错误的问题。

步骤1：在子应用src目录下创建名称为public-path.js的文件，并添加如下内容

import {isMicroAppEnvironment, getPublicPath} from "sws-micro-app-adapter";

if (isMicroAppEnvironment()) {
    // eslint-disable-next-line
    __webpack_public_path__ = getPublicPath();
}

步骤2：在子应用入口文件的最顶部引入public-path.js

import './public-path'