qiankun 只能解决子项目之间的样式相互污染，不能解决子项目的样式污染主项目的样式
不仅是 qiankun，icestark微前端也存在这个情况，其他微前端框架暂未测试。

样式污染场景

  1. 主项目是 antd3.x，子项目是 antd4.x就会引起 antd的样式污染
    1. 因为没有shadow dom，样式会直接冲突。
  2. 主项目本身的 id/class 太简单，被子项目匹配到
  3. 主项目和子项目可以公用全局的 global.less

避免样式污染

  1. 如果子项目是 vue 技术，样式可以写 css-scoped
  2. 如果是 react技术，就用 cssModules
  3. 如果是不同的 antd版本，子项目修改 ant的 prefix前缀

css约定规范

  1. css BEM

@ant-prefix

https://github.com/ant-design/ant-design/blob/2c6c789e3a9356f96c47aea0083f5a15538315cf/components/style/themes/default.less#L7
把 ant-的前缀改成自定义的前缀，比如子项目的名字；因为前缀不同，不同的css就不会相互污染。

2处改动，
利用ant design提供的ConfigProvider 组件中的相关属性，配合less-loader的方法修改前缀

  1. less-loader加入这句 ```jsx modifyVars: { ‘ant-prefix’: ‘blog’, },

// 最好定义成 less变量 @ant-main-prefix-cls: blog;

  2. 2. 入口组件，基本就是App.js 或 index.js
  3. ```jsx
  4. <ConfigProvider prefixCls="blog">
  5. </ConfigProvider>

ant-design/components/style/themes/default.less
image.png

qiankun 沙箱

strictStyleIsolation
qiankun.js本身自带沙箱，如果开启strictStyleIsolation，会为每个微应用的容器包裹上一个 shadow dom

qiankun常见问题
https://www.cnblogs.com/goloving/p/14881461.html
https://blog.csdn.net/rx_lj/article/details/118731667