TypeError:中间件不是一个函数

Question

我正试图在我的reactjs应用程序中应用redux。我不能继续下去，因为这些错误：

​

​

​

​

我确信我已经安装了所需的所有依赖项。以下是我的package.json的相关部分

"dependencies": {
   "react-redux": "^5.0.6",
   "redux": "^3.7.2",
   "redux-logger": "^3.0.6",
   "redux-promise": "^0.5.3",
   "redux-thunk": "^2.2.0",
}

下面是实现redux的index.js的一部分

import { createStore, applyMiddleware } from 'redux';
import { Provider } from 'react-redux';
import thunkMiddleware from 'redux-thunk';
import createLogger from 'redux-logger';
import reducers from './reducers';

const logger = createLogger();
const store = createStore(reducers,
    applyMiddleware(
        thunkMiddleware, logger
    )
)

ReactDOM.render(
    <Provider store={store}>
        <App />
    </Provider>,
    document.getElementById('root')
);

Answer 1

根据文档，您混淆了redux-logger的用法

您需要导入特定的createLogger函数。

import { createLogger } from 'redux-logger'

const logger = createLogger({
  // ...options
});

或使用默认导入。

import logger from 'redux-logger'

然后你的代码应该没问题

const store = createStore(
  reducers,
  applyMiddleware(thunkMiddleware, logger)
)

Answer 2

我得到了同样的错误TypeError:中间件不是一个函数。

​

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)
);

​

用applyMiddleware(logger, thunk)代替applyMiddleware(logger, thunk.default)为我工作。

Answer 3

import logger from 'redux-logger';
import thunk from 'redux-thunk';
import reduxPromiseMiddleware from 'redux-promise-middleware';
import { applyMiddleware, createStore } from 'redux';

const middleware = applyMiddleware(reduxPromiseMiddleware, thunk, logger);
const store = createStore(reducer, middleware);