@ appshell/ react- shell (英语)
Appshell React shell 用于与 Appshell 和 Webpack Module Federation 一起构建微前端.
工作实例可见于此 这里。 。 。 .
@appshell/react-shell 是挂载您微前端的浏览器捆绑 。 它不是一个服务器——
appshell 注册程序使 shell 文档, 将解析的构成线入, 并为它服务
在 URL 上捆绑一个应用程序 shellBundleUrl 点数.
打造微前端?. 你不需要这个包裹. 运行自己的 dev 服务器并发布到 应用程序; 注册员为您装入 shell 捆绑。 这个读取器是用来打包的 用于操作捆绑本身.
选择捆绑
每个应用程序都会解决一个外壳捆绑. 默认是登记图像的船,所以
没什么可配置的。 点 shellBundleUrl 在其它地方将一个版本或服务从CDN上绑上:
appshell app create my-env --shell-bundle-url https://cdn.example.com/appshell/1.2.3/main.js
软件包发布 dist/ 因此,一个注册图像可以在一个版本下服务
路径和指针成为普通的依赖突起:
RUN npm install @appshell/[email protected]
RUN cp -R node_modules/@appshell/react-shell/dist public/shell
正在处理捆绑
npm start 服务 main.js - 登记员还是做壳的,所以你开发
和部署时的相同 登记册不必是本地的: shellBundleUrl 实值
由浏览器解决,所以共享注册可以指向您的机器.
npm start
appshell app create shell-dev --ephemeral --shell-bundle-url http://localhost:3030/main.js
说明 克罗姆和火花
localhost作为一个可靠的来源,所以https登记册可能装入http从它捆起来。 Safari更严格——在当地进行登记或服务main.js超过TLS.
应用程序配置
注册提供根远程,它的道具, 和页面的标题,颜色, 外观和样式表,将它们嵌入它所服务的文件。 什么都没有发生 从这个包的环境 更多的.
这里剩下的是dev服务器和CLI配置:
# Port the bundle's development server listens on
APPSHELL_PORT=3030
# Registry to publish and activate against
APPSHELL_REGISTRY=
# Credential for that registry
APPSHELL_API_KEY=
在根远程挂载前填充页面的
没有,现在。 外壳不会回落: 何以覆盖空隙而根会 获取远程是应用程序的业务, 它不能来自根 包本身——这个包是等待的东西。 它必须来自 记录登记处制作的文件.
用来运载一 Splash 组件,通过两个 env vars 配置
当注册人接管页面渲染时,它停止了访问浏览器,所以它已经
一段时间以来,一直在渲染其硬码回落颜色。 它被移除,而不是
重新接线:在文档的首次涂料上涂上一幅文档级别的喷出涂料,而不是之后
贝壳捆绑下载、解析和挂载回放,可以按
应用程序而不是此软件包.
内部遥控器没有受到影响—— RemoteSlot 使用一个 fallback 道具,这一直是
是消费者的供给.