I'm trying to implement a simple asynchronous API call in my Javascript application with Redux.
Folder1\REDUX-DEMO\node_modules\redux\dist\cjs\redux.cjs:407
const chain = middlewares.map((middleware) => middleware(middlewareAPI));
TypeError: middleware is not a function ^
And I'm persistently receiving the aforementioned error in the terminal
Below is the relevant part of the code for the application
const redux = require("redux");
const createStore = redux.createStore;
const applyMiddleware = redux.applyMiddleware;
const thunkMiddleware = require("redux-thunk").default;
const reduxLogger = require("redux-logger");
const logger = reduxLogger.createLogger();
const promiseMiddleware = require('redux-promise').default;
const axios = require("axios");
//thecodeinbetween...
const middleware = applyMiddleware(thunkMiddleware, promiseMiddleware, logger);
const store = createStore(reducer, middleware);
store.subscribe(() => {
console.log(store.getState());
});
store.dispatch(fetchUsers());
I've tried installing and reinstalling the dependencies
"dependencies": {
"axios": "^1.6.2",
"immer": "^10.0.3",
"redux": "^5.0.0",
"redux-logger": "^3.0.6",
"redux-promise": "^0.6.0",
"redux-thunk": "^3.1.0"
And I've applied all the necessary corrections I could think of from what I found on the internet. Still getting the same error
You need to do
const thunkMiddleware = require("redux-thunk").thunk;
, notconst thunkMiddleware = require("redux-thunk").default;
with redux-thunk since version 3.But apart from that, please be aware that you are using a pre-2019 style of Redux, and Redux has changed considerably since then, to the point where you write less than 1/3 of the code and don't have any of all the setup you are doing here. I'd highly recommend you to follow the official Redux tutorial.