使用Redux chrome扩展时“没有找到商店”

I have a problem with redux chrome extension.

我对redux chrome扩展有问题。

I have the following code in my configureStore.js file :

我在configure中有以下代码。js文件:

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

export default function configureStore(initialState){
  return createStore(
    rootReducer,
    initialState,
    applyMiddleware(thunk),
    window.devToolsExtension ? window.devToolsExtension() : f => f
  );
}

I've added window.devToolsExtension ? window.devToolsExtension() : f => f like on the tutorial.

我已经添加了window.devToolsExtension吗?windows . devtoolsextension (): f =>，就像本教程中描述的那样。

But when I try to run the extension I get

但是当我尝试运行扩展时，我得到

EDIT

编辑

import 'babel-polyfill';
import React from 'react';
import {render} from 'react-dom';
import {Router, browserHistory} from 'react-router';
import routes from './routes';
import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
import './assets/sass/main.scss';
import '../node_modules/font-awesome/css/font-awesome.css';

import {loadCourses} from './actions/courseActions';
import {loadAuthors} from './actions/authorActions';
import {Provider} from 'react-redux';
import configureStore from './store/configureStore';

const store = configureStore();
store.dispatch(loadCourses());
store.dispatch(loadAuthors());

render(
  <Provider store={store}><Router history={browserHistory} routes={routes}/></Provider>, document.getElementById("app")
);

Any advice?

任何建议吗?

3 个解决方案

#1

I've got the solution from here.

我从这里得到了解。

The right code is :

正确的代码是:

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

export default function configureStore(initialState){
  return createStore(
    rootReducer,
    initialState,
    compose(
      applyMiddleware(thunk),
      window.devToolsExtension ? window.devToolsExtension() : f => f
    )
  );
}

#2

Ok, just checking the official repository of the Redux Dev Tools I found they recommend to use __REDUX_DEVTOOLS_EXTENSION__ instead of devToolsExtension as you are using.

好的，检查一下Redux Dev工具的官方存储库，我发现他们建议使用__REDUX_DEVTOOLS_EXTENSION__，而不是您正在使用的devToolsExtension。

So after just this update my code and de connectino with the plugin start working like a charm.

因此，在更新了我的代码和插件de connectino之后，它就像一个魔咒一样开始发挥作用。

Here a sample code if it helps anyone:

这里有一个示例代码，如果它对任何人都有帮助的话:

const enhancers = compose(
  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
  );

const store = createStore(
  rootReducer,
  defaultState,
  enhancers
);

#3

There is a simpler solution now from the redux-devtools folks. See:

现在有一个更简单的解决方案来自redux-devtools。看到的:

section 1.3 Use redux-devtools-extension package from npm at https://github.com/zalmoxisus/redux-devtools-extension

第1.3节使用npm提供的redux-devtools扩展包(https://github.com/zalmoxisus/redux- devtoolsextension -extension)

basically, if you npm install there redux-devtools-extension you can:

基本上，如果你在那里安装了redux-devtools-extension，你可以:

import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';

const store = createStore(reducer, composeWithDevTools(
  applyMiddleware(...middleware),
  // other store enhancers if any
));

In my case I only have one piece of middleware (redux-thunk) but I have an initialState so it looks like this:

在我的例子中，我只有一个中间件(redux-thunk)，但是我有一个初始状态，所以它看起来是这样的:

const store = createStore(reducer, initalState, composeWithDevTools(applyMiddleware(thunk)))
store.subscribe(() => console.log("current store: ", JSON.stringify(store.getState(), null, 4)))

#1