何為qiankun框架，有什么用？

• qiankun框架就是基于singl-spa的微前端實(shí)現(xiàn)庫(kù)。通俗的講就是多個(gè)項(xiàng)目有vue開發(fā)的，react開發(fā)的、angular開發(fā)的三個(gè)項(xiàng)目，通過(guò)一個(gè)主應(yīng)用界面菜單點(diǎn)擊分別進(jìn)入三個(gè)應(yīng)用，但是不會(huì)出現(xiàn)跨域，路由正常導(dǎo)航，不會(huì)讓人發(fā)覺(jué)是多個(gè)項(xiàng)目的實(shí)現(xiàn)功能框架。
• qiankun框架有什么作用？當(dāng)多個(gè)子項(xiàng)目開發(fā)完畢分別部署上線使用了，但是現(xiàn)在有需求需要將項(xiàng)目合并到一起，但是項(xiàng)目的開發(fā)框架不同，部署地址不同，就無(wú)法使用iframe實(shí)現(xiàn)跨域，又不想重構(gòu)項(xiàng)目，就可以用乾坤框架。

qiankun框架從0開始搭建使用

示例： 分別創(chuàng)建兩個(gè)vue2項(xiàng)目，主應(yīng)用 qiankun_main, 子應(yīng)用 qiankun_app1,

• 提示： 將node版本切換至14版本*
  1、以下說(shuō)明主應(yīng)用qiankun_main的操作步驟：
  （1）安裝qiankun框架
  npm install qiankun -S
  （2）main.js使用乾坤框架引入子應(yīng)用

import { registerMicroApps, start } from 'qiankun'

registerMicroApps([
  {
    name: 'app1',  //名字
    entry: '//localhost:8066',  //子應(yīng)用運(yùn)行時(shí)的服務(wù)地址端口
    container: '#app1',  //當(dāng)前為子應(yīng)用創(chuàng)建的ip
    activeRule: '/app1'  //子應(yīng)用的路由
  }
])
start() //啟動(dòng)框架

（3）在頁(yè)面中添加dom占位符，展示子應(yīng)用頁(yè)面
<div id="app1"></div> 這里的id=app1和上面的container對(duì)應(yīng)的id名稱對(duì)應(yīng)

• http://localhost:8081/#/app1就是對(duì)應(yīng)的子應(yīng)用路由

2、以下說(shuō)明子應(yīng)用qiankun_app1的操作步驟：
（1）安裝qiankun框架
npm install qiankun -S
（2）在src同級(jí)目錄新增文件public-path.js

if (window.__POWERED_BY_QIANKUN__) {
  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
}

（3）main.js判斷是否是父組件進(jìn)入
1、識(shí)別是否是乾坤框 window.POWERED_BY_QIANKUN
2、使用乾坤框架的生命周期 bootstrap mount unmount

• • 注意</font>：
• （1）子應(yīng)用所有的路由前面都要加上/app1的路由才能正確導(dǎo)航到子應(yīng)用的各個(gè)路由*
• （2）父子應(yīng)用都應(yīng)使用hash模式的路由導(dǎo)航*
• （3）主應(yīng)用的和子應(yīng)用的最外層dom的id要區(qū)分，不能都是#app*