CODEWITHSUNDEEP
reactjsreduxreact-redux
Arman Feyzi
Arman Feyzi

Reputation: 838

react redux add "redux-thunk" middlewares to store

i want to add redux-thunk to store, but when add this middlewares.push(thunkMiddleware) in store file i get error middleware is not a function in console. how i can fix this?

my 'store.js' file (line 21):

import { createStore, applyMiddleware, compose } from "redux";
import { browserHistory } from "react-router";
import { syncHistoryWithStore, routerMiddleware } from "react-router-redux";
import createSagaMiddleware from "redux-saga";
import {thunk, thunkMiddleware } from 'redux-thunk';
import freeze from "redux-freeze";
import { reducers } from "./reducers/index";
import { sagas } from "./sagas/index";

// add the middlewares
let middlewares = [];

// add the router middleware
middlewares.push(routerMiddleware(browserHistory));

// add the saga middleware
const sagaMiddleware = createSagaMiddleware();
middlewares.push(sagaMiddleware);

// add redux-thunk middleware
middlewares.push(thunkMiddleware);

// add the freeze dev middleware
if (process.env.NODE_ENV !== 'production') {
  middlewares.push(freeze);
}

// apply the middleware
let middleware = applyMiddleware(...middlewares);

// add the redux dev tools
if (process.env.NODE_ENV !== 'production' && window.devToolsExtension) {
  middleware = compose(middleware, window.devToolsExtension());
}

// create the store
const store = createStore(reducers, middleware);
const history = syncHistoryWithStore(browserHistory, store);
sagaMiddleware.run(sagas);

// export
export { store, history };

ERROR: Uncaught TypeError: middleware is not a function

Upvotes: 0

Views: 354

Answers (1)

Shubham Khatri
Shubham Khatri

Reputation: 281626

thunk is the default export from redux-thunk and you need to use that as a middleware and not thunkmiddleware

import thunk from 'redux-thunk';

// add redux-thunk middleware
middlewares.push(thunk);

Upvotes: 2

Related Questions