I am trying to make a modular structure of the application using React + Redux , where individual modules will be in their repositories (for example, application , admin , account etc.) modules. The implementation is now as follows:

index.js

 import { Application } from 'application-module'; import { ModuleAdmin } from 'admin-panel'; const app = new Application(); const moduleAdmin = new ModuleAdmin(app); [app, moduleAdmin].forEach(element => { element.start(); });

In the application-module in the start() method, the React application is initialized and the necessary routing is added:

application-module

 start() { this.store = this.configureStore({}); const AppComponent = () => ( <Provider store={this.store}> <Router> <Switch> {this.routes.map((route: any, i: number) => ( <Route key={i} path={route.path} component={route.component} /> ))} </Switch> </Router> </Provider> ); ReactDOM.render(<AppComponent />, document.getElementById('root')); serviceWorker.unregister(); }

Admin admin-panel module - admin-panel (OOP shell over smart component with public methods for interacting with other modules)

 constructor(app: IApp) { this.component = withProps({ admin: this })(AdminPanel); this.app = app; this.routes = [ { path: '/admin', component: this.component } ]; this.app.addReducer(this.reducer); this.routes.forEach(route => this.app.addRoute(route.path, route.component) ); }

When I try to start all this, an error flies:

Could not find "store" in the context of "Connect (withHandlers (lifecycle (Component)))". Contrary to the corresponding component in which it connects with the life-component (lifecycle (Component)).

Obviously, the admin does not see the store , which lies in the application-module , but how to fix it is not clear. Is there any way?

    0