CODEWITHSUNDEEP
reactjsreduxreact-reduxreducedeprecated
wd3
wd3

Reputation: 331

Uncaught Error: "reducer" is a required argument, and must be a function or an object of functions that can be passed to combineReducers

recently i had this error in my browser's console: Uncaught Error: "reducer" is a required argument, and must be a function or an object of functions that can be passed to combineReducers

so i was trying to solve it for few hours but nothing helped ...

from the very beginning when i created this script i copied some parts of it from the other my script that i created half a year ago or so... then i found some functions deprecated and tried to upgrade them...

my old redux-store.js script was like this:

...
let reducers = combineReducers({

     auth: auth_reducer,
     admin: admin_reducer,
     index: index_reducer
})


const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
    reducers, 
    composeEnhancers(
        applyMiddleware(thunkMiddleware)
    )
);
...

but then i changed (upgraded) it and error from title appeared... error

Upvotes: 4

Views: 13644

Answers (5)

Rojeet Dhakal
Rojeet Dhakal

Reputation: 1

This error arises if you write "reducers" instead of "reducer".

export const store= configureStore({
    reducer:{
        posts:postsReducer

    }
})

Upvotes: 0

Omer Faruk Dasar
Omer Faruk Dasar

Reputation: 150

With the latest update, createStore is not used anymore. Instead of it, configureStore is used. I try to pass a reducer argument as a function but, it does not work. So, i create like

const store = configureStore({ reducer: counterReducer });

A friendly abstraction over the standard Redux createStore function that adds good defaults to the store setup for a better development experience. ConfigureStore

Upvotes: 1

Nathaniel SENOU
Nathaniel SENOU

Reputation: 1

const store = configureStore({reducer})

Upvotes: 0

phry
phry

Reputation: 44086

configureStore is actually used differently and will automatically set up the dev tools and thunks. You also don't need combineReducers.

You just do (really remove all the other code you showed there!):

const store = configureStore({
  reducer:{
     book: booking_reducer,
     admin: admin_reducer,
  }
})

Also, this is pretty much a nudge that your whole application might benefit from modern Redux patterns, as modern Redux does not use switch..case reducers, ACTION_TYPES, immutable reducer logic or connect any more. As a consequence it's 1/4 of the code.

I'd recommend reading Why Redux Toolkit is How To Use Redux Today and going through the official Redux Essentials Tutorial

Upvotes: 3

wd3
wd3

Reputation: 331

nothing helped untill i changed argument name in function configureStore() from reducers to just reducer

like this:

...
let reducers = combineReducers({
     book: booking_reducer,
     admin: admin_reducer,
})

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = configureStore(
        {reducer:reducers},
        composeEnhancers(
            applyMiddleware(thunkMiddleware)
        )
    );
...

I hope this post will help someone to save hours of debugging ;)

Upvotes: 16

Related Questions