javascript - the - "No se encontró ninguna tienda" cuando se usa la extensión Redux de Chrome

to view this video please enable javascript and consider upgrading to a web browser that

Question

Tengo un problema con la extensión redux crome.

Tengo el siguiente código en mi archivo configureStore.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
  );
}

He agregado window.devToolsExtension ? window.devToolsExtension() : f => f window.devToolsExtension ? window.devToolsExtension() : f => f gusta en el tutorial .

Pero cuando intento ejecutar la extensión, obtengo

EDITAR

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")
);

¿Algún consejo?

Answer 1

Tengo la solución desde aquí .

El código correcto es:

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
    )
  );
}

Answer 2

Hay una solución más simple ahora de la gente redux-devtools. Ver:

sección 1.3 Utilice el paquete redux-devtools-extension de npm en https://github.com/zalmoxisus/redux-devtools-extension

básicamente, si npm instala allí redux-devtools-extension puede:

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

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

En mi caso, solo tengo una pieza de middleware (redux-thunk) pero tengo un initialState así que se ve así:

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

Answer 3

Ok, solo revisando el repositorio oficial de las Herramientas de Redux Dev Encontré que recomiendan usar __REDUX_DEVTOOLS_EXTENSION__ lugar de devToolsExtension mientras lo estás usando.

Entonces, después de esta actualización, mi código y de Connectino con el complemento comienzan a funcionar como un amuleto.

Aquí un código de muestra si ayuda a alguien:

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

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