我正在尝试创建一个小项目来实现微前端架构，如下微前端 https://martinfowler.com/articles/micro-frontends.html文章。我正在为每个 MFE（微前端）创建多个存储库，并为该应用程序使用 Redux。我有以下架构：
-
Frame- 一个集中式（主）存储库，负责渲染主要应用程序部分和基于路由的 MFE（我正在使用connected-react-router）。它初始化 Redux 存储并添加一个injectReducer动态添加减速器的函数，如中所述redux 中的代码分割 https://redux.js.org/recipes/code-splitting#defining-an-injectreducer-function文档。该框架获取特定 MFE 的清单并呈现它。该框架还有一些用于身份验证目的的 redux 数据。
-
MFEs- 这些是单独的功能应用程序，并按帧渲染。
现在我有一个问题想要使用injectReducer将函数添加到我的 MFE 中以动态添加要存储的减速器。为此，我需要访问相同的store由框架创建的实例。
正如中提到的这个答案 https://stackoverflow.com/questions/38460949/what-is-the-best-way-to-access-redux-store-outside-a-react-component，理想的方法是导出创建的商店实例并使用它，但是我们如何在多个存储库之间共享相同的商店实例？
文章中有一条评论直接解决了这个问题：
如果您使用 redux，通常的方法是为整个应用程序建立一个单一的、全局的、共享的存储。然而，如果每个微前端都应该是自己独立的应用程序，那么每个微前端都有自己的 redux 存储是有意义的。 redux 文档甚至提到“将 Redux 应用程序隔离为更大应用程序中的组件”作为拥有多个商店的正当理由。
长话短说：不要分享你的 redux store
Sharing anything微前端之间的区别不再使它们成为独立的实体，并且违背了它的全部目的。现在它只是一个过度设计的庞然大物。只需将这些各自的存储库转换为整体存储库中定义明确的模块即可。仍然可以在统一的存储库中将职责划分到各自的孤岛中。只是需要更多的纪律。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
