TypeError: middleware is not a function
According to the docs you are mixing up the usage of redux-logger
You either need to import the specific createLogger
function
import { createLogger } from 'redux-logger'const logger = createLogger({ // ...options});
Or use the default import
import logger from 'redux-logger'
And then your code should be fine
const store = createStore( reducers, applyMiddleware(thunkMiddleware, logger))
I don't see react and react-dom in your dependencies, and it is not included in the import statements.
Let me provide you with an example of how I did an App recently, also using the redux developer tools which is amazing.
import React from 'react';import ReactDOM from 'react-dom';import { Provider } from 'react-redux';import { createStore, combineReducers, applyMiddleware, compose } from 'redux';import reduxThunk from 'redux-thunk';import App from './components/App';import authReducer from '../reducers/auth';import urlsReducer from '../reducers/urls';const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;//Store creation const store = createStore( combineReducers({ auth: authReducer, urls: urlsReducer }), composeEnhancers(applyMiddleware(reduxThunk)) );ReactDOM.render( <Provider store={store}> <App /> </Provider>, document.getElementById('root') );
I would figure that you just need to add logger, after reduxThunk. And if you have already combined your reducers, then just provide reducers instead of combineReducers.
Regards,Rafael
I was getting the same error TypeError: middleware is not a function.
import { createStore, combineReducers, applyMiddleware } from "redux";import { createLogger } from "redux-logger";import thunk from "redux-thunk";import math from "./reducers/mathReducer";import user from "./reducers/userReducer";const logger = createLogger();export default createStore( combineReducers({ math, user }), {}, applyMiddleware(logger, thunk));
Replacing applyMiddleware(logger, thunk)
with applyMiddleware(logger, thunk.default)
worked for me.