Question

我禁用了react devtools和redux devtools。

数小时以来，我一直在寻找解决此问题的方法，而大多数问题都是在编写中，而我根本不需要更改代码。

import { createStore, applyMiddleware,compose } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const initialState={};

const middleware = [thunk];

const store = createStore(rootReducer,initialState,
    compose(
        applyMiddleware(...middleware),
        window.__REDUX_DEVTOOLS_EXTENSION__&& window.__REDUX_DEVTOOLS_EXTENSION__()
        )   
    );


export default store;

我真的不明白为什么会这样。我什么都没做，最后要做的就是将git push origin master推送到我的存储库，突然我编译时遇到了这个错误：

我在前端使用它：

  "@material-ui/core": "^3.3.1",
    "@material-ui/icons": "^3.0.1",
    "axios": "^0.18.0",
    "jwt-decode": "^2.2.0",
    "prop-types": "^15.6.2",
    "react": "^16.6.0",
    "react-dom": "^16.6.0",
    "react-redux": "^5.1.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.0.5",
    "react-select": "^2.1.1",
    "recharts": "^1.3.5",
    "redux": "^4.0.1",
    "redux-thunk": "^2.3.0",
    "typeface-roboto": "0.0.54"

后端：

 "dependencies": {
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.18.3",
    "express": "^4.16.4",
    "mongoose": "^5.3.11",
    "multer": "^1.4.1",
    "passport": "^0.4.0",
    "passport-jwt": "^4.0.0",
    "path": "^0.12.7",
    "validator": "^10.9.0",
    "xlsx": "^0.14.1"
  },
  "devDependencies": {
    "concurrently": "^4.0.1",
    "nodemon": "^1.18.6",
  },

结果错误：

Redux：

Answer 1

将您的redux开发工具从2.16.0更新到2.16.1

OR

从代码中删除此行

window.__REDUX_DEVTOOLS_EXTENSION__&& window.__REDUX_DEVTOOLS_EXTENSION__()

Answer 2

最后一个堆栈显示了在client/src/store.js:9中进行compose的调用，其中第二个参数是window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()。

但是，如果禁用了devtools，则__REDUX_DEVTOOLS_EXTENSION__是未定义的，并成为撰写函数的第二个参数。它仍然是显式提供的，这与通过省略隐式未定义而不同，因此compose实现认为有两个有效参数，并希望它们是函数，而不是未定义。

在没有可用的devtools的情况下，您应该返回一个虚拟函数，例如，也许这样，尽管我不太确定要满足createStore函数的确切签名是什么。

window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() : (a) -> a

Answer 3

我改变了

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

对此：

typeof window.__REDUX_DEVTOOLS_EXTENSION__ === "undefined"
? a => a
: window.__REDUX_DEVTOOLS_EXTENSION__ &&
    window.__REDUX_DEVTOOLS_EXTENSION__()

问题已经解决

Answer 4

当我想在隐身窗口上测试我的Web应用程序时遇到同样的问题（扩展名不会显示在隐身窗口上）。

问题是compose中的redux期望其所有参数都是函数。所以当

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

在该环境中求值，它返回一个布尔值。

如@knutwalker所述。您需要返回不返回任何内容的函数。

      window.__REDUX_DEVTOOLS_EXTENSION__
        ? window.__REDUX_DEVTOOLS_EXTENSION__()
        : f => f

Answer 5

此错误的原因在于问题本身。只需启用React和Redux DevTools扩展。对于相同的错误，它对我有用。

Answer 6

此错误是由于：

const store=createStore(rootreducer,
    initialstate,
    compose(applyMiddleware(...middleware),
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
)

在部署项目时，您没有这样做：

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

在运行命令npm run build时，请确保将其删除。
正确的方法是：

const store=createStore(rootreducer,
    initialstate,
    compose(applyMiddleware(...middleware))
)

Answer 7

我遇到了类似的问题，删除这些行可以解决问题，

 window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

但这不是永久性的解决方案，因为再次使用redux dev工具时需要这些行。改为使用

process.env.NODE_ENV==="development" ?
       window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() : compose,

它使用env变量检查天气是否使用Reduxdev工具中间件。因为我没有在此线程中看到此解决方案，所以我发布了它，希望它对某人有用。.

Answer 8

对我来说，我在Chrome中添加了redux-devtools扩展名，并且在将redux-devtools添加到浏览器后，错误消失了，并且您也不需要使用三元运算符。

https://github.com/reduxjs/redux/issues/2359#issuecomment-362340634

Answer 9

对于我来说，解决此问题的最佳方法很简单。

您知道cypress在开发人员模式下打开chrome，该扩展程序没有您的扩展程序，包括redux devtools。

因此，当chrome窗口打开并出现错误时，请点击菜单>更多工具>扩展程序，然后从chrome网站商店安装 redux devtools 。

Answer 10

请确保您已下载用于chrome的redux-devtools扩展名，并将站点访问权限更改为在所有站点上或在特定站点上转到管理扩展> Redux DevTools（详细信息）>网站访问权限

Answer 11

这发生在Redux DevTools 2.17.0版本中。

扩展中的某些内容损坏了。

我刚刚从Chome中删除了扩展名，重新安装了它，它的工作就像一个魅力。

Answer 12

这对我有用：

这个错误是因为：

const store=createStore(rootreducer,
    initialstate,
    compose(applyMiddleware(...middleware),
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
)

在部署项目时删除最后一行，如下所示：

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

在运行命令 npm run build 时，请确保将其删除。正确的做法是：

const store=createStore(rootreducer,
    initialstate,
    compose(applyMiddleware(...middleware))
)

Answer 13

在 Chrome 隐身窗口中出现同样的错误。更改为普通 Chrome，一切正常。

Answer 14

这是对我有用的@Koop 的完整answer：

对于在 node_modules/redux/es/redux.js 中遇到“TypeError: Cannot read property ‘apply’ of undefined”的每个人：错误：立即修复：安装 Chrome 扩展 Redux Devtools 所有浏览器的永久修复：

在客户端目录：npm install --save-dev redux-devtools-extension
将 client/src/store/index.js 更改为：

import { applyMiddleware, createStore, } from ‘redux’;
import createSagaMiddleware from ‘redux-saga’;

import rootReducer from ‘./reducers/index’;
import rootSaga from ‘./sagas/index’;
import { composeWithDevTools } from ‘redux-devtools-extension’;

const sagaMiddleware = createSagaMiddleware();
const store = createStore(
  rootReducer,
  composeWithDevTools(applyMiddleware(sagaMiddleware))
);
sagaMiddleware.run(rootSaga);
export default store;

Answer 15

就我而言，此错误导致在移动浏览器上的生产版本中出现空白/白屏，但在桌面浏览器中则不然。接受的答案对我不起作用，我必须删除该行，添加 devtools 扩展，并重构以使用 composeWithDevTools 导入。也就是说，@Roman 的回答对我来说是一个完整的工作解决方案（谢谢先生）。但它可能有助于其他人澄清问题可以独立于 redux-saga 发生。我的应用程序只是使用基本的 redux-thunk。我安装了 redux-devtools-extension 作为开发依赖，然后替换了这个：

import { createStore, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const initialState = {};

const middleware = [thunk];

if (nodeEnv !== 'production') {
  const store = createStore(rootReducer, initialState, compose(applyMiddleware(...middleware)));
} else {
  const store = createStore(
    rootReducer,
    initialState,
    compose(
      applyMiddleware(...middleware),
      window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(),
    ),
  );
}

export default store;

这样：

import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const initialState = {};

const middleware = [thunk];

const store = createStore(
  rootReducer,
  initialState,
  composeWithDevTools(applyMiddleware(...middleware))
);

export default store;

然后就解决了。

Answer 16

改变这一行

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

到

window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() : f => f

将解决这个问题，它对我有用。

Redux TypeError：无法读取未定义的属性“ apply”

16 个答案: