子系统切换后Formily的MegaLayout样式表丢失

PYLDora commented 2 years ago

最小可复现仓库：无 qiankun 版本：2.6.1 浏览器版本：96.0.4664.110（正式版本） (x86_64) NodeJs 版本：v14.16.0 操作系统：macOS

在已发布的网页上，第一次进入qiankun子系统，MegaLayout渲染正常。如果切换子系统，再切换回来，MegaLayout无法读取样式表从而样式失效。如果是本地运行项目，qiankun嵌入本地项目不会复现问题

下图为第一次进入子系统渲染的MegaLayout子系统以及对应的部分样式表：

下图为切换子系统后渲染的样子和对应的部分样式表：可以发现，样式名字还在，但是名字对应的样式表丢失。翻阅Formily的源码，可知MegaLayout的样式是根据写入的配置生成后通过js写入的，而通过import-html-entry的源码，得知只要加载过一次的子系统的js、css等会写入embedHTMLCache里，再次进入如果通过url查询如果有配置就直接读取，不确定通过embedHTMLCache读取和复现配置是否影响了MegaLayout的动态写入，且官方也没有阻止写入或者清空embedHTMLCache的API或者方法（之前看到有其他小伙伴通过改包的方法新增API清空对应缓存，但是对于项目而言，手动改包太难受）。MegaLayout在项目中应用很多，如果失效对项目影响严重。请官方大大看到后能够尽快解决问题。

ps：由于项目是公司项目，不方便完全贴出来。如果需要具体网址复现问题，请官方大大私聊我。

PYLDora commented 2 years ago

不带处理的吗？

codcer commented 2 years ago

这个是styled-components机制和qiankun处理styled-components机制的问题，可以直接设置下标志 process.env.REACT_APP_SC_DISABLE_SPEEDY = true; 【这个是create-react-app 初始化的仓库】；亲测有效

li9269391 commented 2 years ago

这个问题我也遇到了，用的是 umi，在 .env 文件加 REACT_APP_SC_DISABLE_SPEEDY、SC_DISABLE_SPEEDY 都没有生效

li9269391 commented 2 years ago

不动态异步加载资源应该可以，但那样打包可能会大很多

codcer commented 2 years ago

这个问题我也遇到了，用的是 umi，在 .env 文件加 REACT_APP_SC_DISABLE_SPEEDY、SC_DISABLE_SPEEDY 都没有生效

检查下REACT_APP_SC_DISABLE_SPEEDY 这个配置有没有设置成功。如果没有弹射，应该配置就可以，如果弹射看下getClientEnvironment有个过滤阶段。

iShawnWang commented 2 years ago

我这边使用 emotion (v10) 也有切换子应用样式丢失的问题

Ybbbb commented 1 year ago

我这边使用 emotion (v10) 也有切换子应用样式丢失的问题

I have the same question, when i use emotion, the package style is ovewritten by the style of antd. Have anyone resolve the problem?

umijs / qiankun

子系统切换后Formily的MegaLayout样式表丢失 #1886