title: Nextjs with redux redux-saga initialize store
body: <p>js like this</p>
  
  <pre><code>import {createStore, applyMiddleware, combineReducers} from 'redux'
  import {composeWithDevTools} from 'redux-devtools-extension'
  import withRedux from 'next-redux-wrapper'
  import nextReduxSaga from 'next-redux-saga'
  import createSagaMiddleware from 'redux-saga'
  
  import {initialState} from './initialState'
  import globalSaga from '../sagas/global'
  
  const sagaMiddleware = createSagaMiddleware()
  
  export function configureStore (reducers,initialState) {
    console.log(initialState)
  
    let states = {}
    Object.keys(reducers).map((key) =&gt; {
      states[key] = initialState[key]
    })
  
    console.log(reducers)
    console.log(states)
    const store = createStore(
      combineReducers({reducers}),
      states,
      composeWithDevTools(applyMiddleware(sagaMiddleware))
    )
    store.sagaTask = sagaMiddleware.run(globalSaga)
    return store
  }
  
  export function withReduxSaga (BaseComponent, reducers) {
    return withRedux(configureStore(reducers,initialState))(nextReduxSaga(BaseComponent))
  }
  
  export default function configureWithReduxSaga(component,reducers){
    return withReduxSaga(component,reducers)
  }
  </code></pre>
  
  <p>and the error is </p>
  
  <pre><code>Store does not have a valid reducer. Make sure the argument passed to
  
  makeStore is not a function
  </code></pre>
  
  <p>What might be wrong, basically I would like to write function that adds <strong>reducers</strong> and <strong>store.global</strong> with specific sagas into nextjs component without much code, best would be something like this:</p>
  
  <pre><code>configureWithReduxSaga(
  {reducer1, reducer2},
  {saga1, saga2}
  )
  </code></pre>
  
  <p>is it possible? I can create root reducer and root saga and pass it to every component, that is not hard to code, but is it performant?</p>