Redux expecting the reducer to be a function

Question

Redux is throwing me:

Error: Expected the reducer to be a function. at lines

from index:

const { store } = configureStore();

from configureStore:

const store = createStore(rootReducer, initialState, devToolsEnhancer())

index.js

import React from 'react';
import { render } from 'react-dom';
import Root from './Root';
import './index.css';
import App from './whitesheet-components/App';
import registerServiceWorker from './registerServiceWorker';
import configureStore from './store/configureStore';

const { store } = configureStore();
const MOUNT_NODE = document.getElementById('root');

const load = Component =>
  render(
    <App>
      <Component store={store} />
    </App>,
    MOUNT_NODE,
  );

load(Root);

registerServiceWorker();

configureStore.js

import { createStore } from 'redux';
import { devToolsEnhancer } from 'redux-devtools-extension';
import rootReducer from './rootReducer';

const isDevelopment = process.env.NODE_ENV !== 'production';
export default function configureStore(initialState = {}) {
  const store = createStore(rootReducer, initialState, devToolsEnhancer());

  if (isDevelopment && module.hot) {
    // Enable Webpack hot module replacement for reducers
    module.hot.accept('./rootReducer.js', () => {
      const nextReducer = require('./rootReducer').default; // eslint-disable-line global-require
      store.replaceReducer(nextReducer);
    });
  }

  return { store };
}

rootReducer

import mockReducer from './mockReducer';

export default { mockReducer };

mockReducer

export default function reducer(state = { hola: 'as' }, { type }) {
  switch (type) {
    default:
      return state;
  }
}

Can't find the bug. First time creating a redux store with devtools plugin support by myself

score 4 · Accepted Answer · answered May 08 '18 at 20:39

4

It looks like you're exporting an object instead of a function in your root reducer.

rootReducer

import mockReducer from './mockReducer';

// export default { mockReducer };
export default mockReducer;

answered May 08 '18 at 20:39

JacobW

826
5
15

Thanks! that worked. How can I export multiple reducers if I cant wrap them in an object? – victor.ja May 08 '18 at 20:45
@victor.ja I suggest using a different file per reducer – Sterling Archer May 08 '18 at 20:45
1

well you can `export default { mockReducer, secondReducer }` and when importing do `import { mockReducer, secondReducer } from './mockReducer'` – JacobW May 08 '18 at 20:47

Redux expecting the reducer to be a function

1 Answers1