qiankun微前端（vue2）

前言

后台管理系统，随着需求增加，项目越来越大，需要做拆分，实现微前端，qiankun适用

一、创建主应用及子应用（vue-cli）

1.主应用：vue create mian（主应用名称）

主应用安装router

npm install vue-router

2.子应用：vue create subapp（子应用名称）

二、主应用安装qiankun

npm i qiankun

三、主应用配置

四、子应用配置

1.根目录创建public-path.js文件

if (window.__POWERED_BY_QIANKUN__) {

    __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;

  }

2.main.js

3.vue.config.js

五、运行

1.首先运行子应用 npm run serve

2.再运行主应用 npm run serve

3.主应用App.vue中加路由跳转即可在主应用中打开子应用

<router-link to="/subapp">子应用</router-link>