React-Native集成Redux-Thunk报错：TypeError: middleware is not a function

核心原因及修复方案 #

1. 修正redux-logger的导入方式 #

这个错误大概率是因为redux-logger的导入不正确——它的默认导出并非直接可用的中间件函数，需要通过解构获取或调用构造函数生成：

方案一：解构导入logger

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { logger } from 'redux-logger'; // 改为解构导入
import app from './reducers/index';

export default function configureStore() {
  const store = createStore(app, applyMiddleware(thunk, logger));
  return store;
}

方案二：自定义logger配置
如果需要自定义日志格式，使用createLogger生成中间件：

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { createLogger } from 'redux-logger';
import app from './reducers/index';

// 可添加自定义配置，比如折叠日志、过滤action等
const logger = createLogger({ collapse: true });

export default function configureStore() {
  const store = createStore(app, applyMiddleware(thunk, logger));
  return store;
}

2. 检查依赖版本兼容性 #

确保redux、redux-thunk、redux-logger版本相互适配：

• 执行npm list redux redux-thunk redux-logger查看当前版本
• Redux v4.x 需搭配 redux-thunk v2.x+、redux-logger v3.x+
• 版本不匹配时，重新安装兼容版本：

npm install redux@^4.2.1 redux-thunk@^2.4.2 redux-logger@^3.0.6 --save

3. 确认applyMiddleware的正确调用 #

确保applyMiddleware正确包裹所有中间件，作为createStore的第二个参数传递。如果后续需要结合其他store增强器（如Redux DevTools），需使用compose组合，但当前场景直接使用applyMiddleware即可。

验证修复 #

修改代码后重启应用：

npx react-native run-android # 针对安卓，iOS替换为run-ios

检查错误是否消失，确认Redux Store初始化正常。

内容的提问来源于stack exchange，提问作者Kirito