micro-app 使用问题全记录
问题1 多页签缓存问题
目前项目是一个后台管理平台,有多页签缓存需求,。页签组件和菜单组件,在基座应用内。 假设我有一个基座应用,2个微应用,每个微应用都有3个路由页面。 在基座应用内的菜单组件,对应两个微应用分别有3个子级菜单,共六个。 现在我把六个页面依次打开,tab页签会出现6个,如何让每个页签都能够独立缓存呢?
期望的效果
6个页签独立缓存,目前只能通过设置每个页签的应用名称不一样进行单独设置,
name === id, 这样不好的点在于每个应用打开都需要把资源加载一边。
问题2
micro-app url 相对路径问题
- ok
<micro-app
name="appName"
url="http://aaaaa.com/aaa/"
></micro-app>
- err
<micro-app
name="appName"
url="/aaa/"
></micro-app>
https://github.com/micro-zoe/micro-app-demo.git 在这个项目中,是否能添加一个 多页签缓存 的 demo 呢。也碰到同样的问题
https://github.com/micro-zoe/micro-app-demo.git 在这个项目中,是否能添加一个 多页签缓存 的 demo 呢。也碰到同样的问题
@jiuyuer 目前多页签缓存的实现就是应用的官网keep alive。不过官方提供的方案,即使是同一个微应用,不同的路由也要定义不同的name。
- 如下:
// app1. home
<micro-app
name="app1Home"
url="http://aaaaa.com/"
></micro-app>
// app1 about
<micro-app
name="app1About"
url="http://aaaaa.com/about/"
></micro-app>
只有这样才行,但是这样就会造成相同的微应用被缓存很多,每出现一个tab就会多一个。
问题3 MonacoEditor 不兼容。
关联问题(#893)
主应用react vite 子应用 react vite,子应用使用了MonacoEditor 组件(
@monaco-editor/react),
- err 如下
大佬有没有遇到
app MicroFmc: An error occurred while parsing CSS:
Error: Declaration missing '{'
大佬有没有遇到
app MicroFmc: An error occurred while parsing CSS: Error: Declaration missing '{'
@k983551019 没有遇到过,您可以提供一个最小实现。
我父子三个应用都是vite构建的module模式的基础项目,使用url方式的时候会有异常如下
我父子三个应用都是vite构建的module模式的基础项目,使用url方式的时候会有异常如下
vite需开启iframe沙箱,参考 https://micro-zoe.github.io/micro-app/docs.html#/zh-cn/framework/vite
大佬,我也遇到了同样的场景,你目前的实现了嘛?我是主应用派发路由更新,子应用处理路由跳转,通过keep-alive进行缓存页面,子应用通过keep-alive保存应用示例,但是目前遇到了切换子应用切换前台渲染为空了
app MicroFmc: An error occurred while parsing CSS: Error: Declaration missing '{'