reactjs - 配置 redux 在所有浏览器上显示无法正常工作

Question

我关注了instructions查看官方文档；我的应用程序在 Chrome 中运行良好，指向 localhost:3000 。然而，现在我遇到了一个问题，因为似乎如果浏览器没有 Redux 扩展，它就无法工作。根据文档，我写出了:

import { createStore, applyMiddleware, compose } from "redux";
import thunk from "redux-thunk";
import rootReducer from "./reducers"; //we dont have to put index.js because its called index.js

const initialState = {};

const middleware = [thunk];

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

export default store;

我错过了什么吗？看来others are running into每个代码库中相同的问题和解决方案似乎都是独一无二的。

<小时/>

编辑:我也 tried this solution ，但我收到错误 TypeError: _store__WEBPACK_IMPORTED_MODULE_12__.default.dispatch is not a function

<小时/>

编辑2:在chrome隐身模式下(未启用redux dev工具扩展)，我遇到了错误，

TypeError: Cannot read property 'apply' of undefined
(anonymous function)
C:/Users/MishaFresh/Desktop/mern-app/MERN_app/client/node_modules/redux/es/redux.js:575
  572 | 
  573 |   return funcs.reduce(function (a, b) {
  574 |     return function () {
> 575 |       return a(b.apply(void 0, arguments));
  576 |     };
  577 |   });
  578 | }

Firefox 中也出现同样的错误。

<小时/>

我的package.json:

"scripts": {
    "client-install": "npm install --prefix client",
    "start": "node server.js",
    "server": "nodemon server.js",
    "client": "npm start --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"

  },

<小时/>

编辑3:

实现以下建议后出现新错误:

TypeError: _store__WEBPACK_IMPORTED_MODULE_12__.default.dispatch is not a function
Module../src/App.js
C:/Users/Me/Desktop/my-app/app/client/src/App.js:40
  37 | //decode it
  38 | const decoded = jwt_decode(localStorage.jwtToken);
  39 | //set user and isAuthenticated
> 40 | store.dispatch(setCurrentUser(decoded));
     | ^  41 | 
  42 | //check for expired token
  43 | const currentTime = Date.now() / 1000;

Answer 1

试试这个:

import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';


const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

export default () => {
  const store = createStore(
    combineReducers({
      // your reducers here...
    }),
    composeEnhancers(applyMiddleware(thunk))
  );

  return store;
};

从您的 github 链接 issue提供了答案，并围绕它进行了大量讨论...(值得再读一两遍)该答案又链接到 advanced setup