sandbox 选项可选
start({ sandbox: true // true | false | { strictStyleIsolation?: boolean, experimentalStyleIsolation?: boolean } })
默认情况下沙箱可以确保单实例场景子应用之间的样式隔离，但是无法确保主应用跟子应用、或者多实例场景的子应用样式隔离。当配置为 { strictStyleIsolation: true } 时表示开启严格的样式隔离模式。这种模式下 qiankun 会为每个微应用的容器包裹上一个 shadow dom 节点，从而确保微应用的样式不会对全局造成影响。
shadow dom coco大神写过一篇文章介绍这个，我就不班门弄斧了
https://www.cnblogs.com/coco1s/p/5711795.html
样式冲突解决方案
qiankun 会自动隔离微应用之间的样式（开启沙箱的情况下），你可以通过手动的方式确保主应用与微应用之间的样式隔离。比如给主应用的所有样式添加一个前缀，或者假如你使用了 ant-design 这样的组件库，你可以通过这篇文档中的配置方式给主应用样式自动添加指定的前缀。
以 antd 为例：
配置 webpack 修改 less 变量
{ loader: 'less-loader', + options: { + modifyVars: { + '@ant-prefix': 'yourPrefix', + }, + javascriptEnabled: true, + }, }
配置 antd ConfigProvider
import { ConfigProvider } from 'antd'; export const MyApp = () => ( <ConfigProvider prefixCls="yourPrefix"> <App /> </ConfigProvider> );
webpack配置的问题
微应用的打包工具还需要增加如下配置：
const packageName = require('./package.json').name; module.exports = { output: { library: `${packageName}-[name]`, libraryTarget: 'umd', jsonpFunction: `webpackJsonp_${packageName}`, }, };
qiankun实践-react微前端应用
起始，准备2个react应用
直接用create-react-app创建两个app应用
npx create-react-app main-app npx create-react-app micro-app
可以得到一个文件夹里有两个项目