M
M
Maxim2015-11-03 17:06:12
React
Maxim, 2015-11-03 17:06:12

Why doesn't redux-logger work in an isomorphic app?

For example, I took the repository https://github.com/bananaoomarang/isomorphic-redux and added redux-logger
to it. I did everything right, it seems.

const store    = applyMiddleware(promiseMiddleware, logger)(createStore)(reducer);

When launching the application in the browser, it gives an error
ReferenceError: window is not defined
   at /home/max/projects/isomorphic-redux/node_modules/redux-logger/lib/index.js:55:33
   at /home/max/projects/isomorphic-redux/shared/lib/promiseMiddleware.js:12:5
   at /home/max/projects/isomorphic-redux/shared/lib/fetchComponentData.js:9:38
   at Array.map (native)
   at fetchComponentData (/home/max/projects/isomorphic-redux/shared/lib/fetchComponentData.js:9:26)
   at /home/max/projects/isomorphic-redux/server.jsx:71:5
   at /home/max/projects/isomorphic-redux/node_modules/react-router/lib/match.js:58:5
   at /home/max/projects/isomorphic-redux/node_modules/react-router/lib/useRoutes.js:120:15
   at done (/home/max/projects/isomorphic-redux/node_modules/react-router/lib/AsyncUtils.js:49:19)
   at /home/max/projects/isomorphic-redux/node_modules/react-router/lib/AsyncUtils.js:55:7

Help me understand where to dig with such an error?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
M
Maxim, 2015-11-03
Antonikhin

Decided by checking "if browser".

import { compose, createStore, combineReducers, applyMiddleware } from 'redux';
import createLogger from 'redux-logger';
import * as reducers from './reducers';
import promises from './middlewares/promises';

const reducer = combineReducers(reducers);
let store = {};

if(process.browser) {
  const logger = createLogger();
  const finalCreateStore = compose(
    applyMiddleware(promises, logger)
  )(createStore);
  store = finalCreateStore(reducer);
} else {
  const finalCreateStore = compose(
    applyMiddleware(promises)
  )(createStore);
  store = finalCreateStore(reducer);
}

export default store;

I
Islam Ibakaev, 2017-04-02
@devellopah

Better somehow so as not to repeat

import { compose, createStore, combineReducers, applyMiddleware } from 'redux';
import createLogger from 'redux-logger';
import * as reducers from './reducers';
import promises from './middlewares/promises';


const reducer = combineReducers(reducers);
const middlewares = [promises];

if(process.env.NODE_ENV === 'development') {
  
  if(process.browser) {
    middlewares.push(createLogger());
  }
  
  // другие миддлвары, которые использовать только в этой среде
}

const store = compose(applyMiddleware(...middlewares))(createStore)(reducer);

export default store;

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question