具体实现

一、start方法（微前端启动方法）

步骤
1、监听路由变化
hash路由监听，通过window.onhashchange监听 history路由监听，history.go、history.back、history.forward使用popstate事件：window.onpopstate，pushState、replaceState需要通过函数重写的方式进行劫持

注意popstate方法返回上级页面，api拿到的是只有返回成功后的路径，解决方法就是其实上个路径就是刚刚的下个路径

// 卸载上一个应用

// 加载下一个应用

2、匹配子应用
1）获取到当前的路由路径 2）去apps（所有应用的路径和路由信息配置）里面查找

3、加载子应用
请求获取子应用的资源: html、css、js const { template, getExternalScripts, execScripts } = await importHTML(app.entry) const container = document.querySelector(app.container) // 1.客户端渲染需要通过执行javascript来生成内容 // 2.浏览器出于安全考虑，innerhtml中的script不会加载执行 container.appendChild(template)

// 手动加载子应用的script // 执行script中的代码 // 使用eval或者new Function

4、渲染子应用

二、解决子应用样式冲突

方案一：

使用shadowdom

方案二:

使用选择器隔离