Benjamin Lee
Benjamin Lee

Reputation: 1224

How to use react-redux connect in a monorepo

I'm adding redux to an expo react native calendar app that's uses components shared in a monorepo.

Here's the basic directory structure:

app/
   web/
      Day.web.js
   shared/
      DayComponent.js
   mobile/
      App.js
      Day.native.js
   

This is a big simplification, but basically, my web and mobile apps call shared/DayComponent which houses a lot of common business logic, which calls either web/ or mobile/Day.js components (which house purely view logic).

When I try to run react-redux's connect inside shared/DayComponent.js, I get this error:


Error: Could not find "store" in the context of "Connect(App)". Either wrap the root component in a <Provider>, or pass a custom React context provider to <Provider> and the corresponding React context consumer to Connect(App) in connect options.

Upvotes: 0

Views: 1114

Answers (1)

Benjamin Lee
Benjamin Lee

Reputation: 1224

Discovered a solution by trial error, found no articles or tutorials on this subject.

For a reason I don't fully understand, connect doesn't want to be called from a module outside the submodule(in this case mobile)'s main directory.

Inside the mobile directory, I made a file called connect.js with nothing but:

import {connect} from 'react-redux'

export default function mobileConnect(...args){
    return connect(...args)
}

Then, instead of importing directly from inside shared/DayComponent.js, I imported connect from this file.

Upvotes: 1

Related Questions