4

我在这里遵循了指南：https ://redux-observable.js.org/docs/basics/SettingUpTheMiddleware.html（部分：Redux DevTools）

商店的配置方式如下：

// @flow

import { createStore, compose, applyMiddleware } from 'redux';
import { createEpicMiddleware } from 'redux-observable';
import { createReducer } from './reducer';
import { epic } from './epic';

const initialState = {};

const configureStore = () => {
  const epicMiddleware = createEpicMiddleware(epic);
  const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
  const enhancers = composeEnhancers(applyMiddleware(epicMiddleware));
  const store = createStore(createReducer(), initialState, enhancers);
  return store;
};

export { configureStore };

但是，如果我没有安装 Redux Devtools Extension，我的 React 应用程序（使用 CRA 引导）将无法工作。

有人可以告诉我我做错了什么吗？

缺少扩展的错误日志：https ://pastebin.com/qzcbXCYQ

编辑：我是个白痴。商店在两个文件中定义，我没有更改从中导入它的那个。清理了重复项，它按预期工作。

4

4 回答 4

7

为了使事情更容易，您可以使用redux-devtools-extensionnpm 中的包。

要安装它，请运行：

npm install --save-dev redux-devtools-extension

并像这样使用：

// @flow

import { createStore, compose, applyMiddleware } from 'redux';
import { createEpicMiddleware } from 'redux-observable';
import { createReducer } from './reducer';
import { epic } from './epic';

import { composeWithDevTools } from 'redux-devtools-extension';


const initialState = {};

const configureStore = () => {
  const epicMiddleware = createEpicMiddleware(epic);
  const enhancers = composeEnhancers(applyMiddleware(epicMiddleware));
  const store = createStore(createReducer(), initialState, composeWithDevTools(
      applyMiddleware(epicMiddleware),
      // other store enhancers if any
));
  return store;
};

export { configureStore };
于 2018-03-09T10:20:20.653 回答
2

我遇到了类似的问题。我只需要调整一条线。我从这个出发：

const composeEnhancers = !__PROD__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : compose

对此：

const composeEnhancers = !__PROD__ ? (window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose) : compose

就我而言，我有__PROD__可用的变量，但可以根据您的情况进行调整。逻辑保持不变。

于 2018-11-13T11:00:01.893 回答
1

此问题通常与没有 redux-devtool 的浏览器有关（也可能出现在 chrome incognito chrome 中）

我认为你应该检查你的 composeEnhancers

  const composeEnhancers =
      typeof window === 'object' &&
      window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?   
      window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
      // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize...
    }) : compose;

参考：https ://github.com/zalmoxisus/redux-devtools-extension#12-advanced-store-setup

于 2019-01-03T07:53:07.190 回答
0

此问题通常与没有 redux-devtool 的浏览器有关（也可能出现在 chrome incognito chrome 中）

撰写（应用中间件（thunk），窗口。REDUX_DEVTOOLS_EXTENSION ||撰写）

它应该工作

或尝试另一个 import { createStore, applyMiddleware, compose } from "redux"; 从“redux-thunk”导入 thunk 从“./Reducer/blogReducer”导入 blogReducer；

const store = createStore( blogReducer, compose(applyMiddleware(thunk), window._ REDUX_DEVTOOLS_EXTENSION && window._ REDUX_DEVTOOLS_EXTENSION () || compose));

导出默认存储

于 2022-02-18T10:37:03.007 回答