How to Remove logs of Redux Logger in Production

If you are using redux in your react native project then most probably you might be using redux logger library too. Redux logger is a very useful library acts as logger for redux and you can have an eye on every actions and reducers.

react native redux logger

Redux logger is required only when your react native app is in development. Because of security as well as performance concerns, it is better to remove logs of redux logger when the app goes for production.

So how can you use Redux logger in development and remove it in production? You can use the if (process.env.NODE_ENV === ‘development’) condition to know whether app is in production or development. Then you just need to declare your middlewares conditionally.

Go through the following code snippet to get the overall idea.

import {
  createStore, applyMiddleware, compose, combineReducers,
} from 'redux';
import thunk from 'redux-thunk';
import { createLogger } from 'redux-logger';
import AuthenticationReducer from '../reducers/AuthenticationReducer';

const appReducers = combineReducers({
  AuthenticationReducer
});

const rootReducer = (state, action) => appReducers(state, action);
const logger = createLogger();
let middleware = [];
if (process.env.NODE_ENV === 'development') {
  middleware = [...middleware, thunk, logger];
} else {
  middleware = [...middleware, thunk];
}

export default createStore(
  rootReducer,
  compose(applyMiddleware(...middleware))
);

Similar Posts

2 Comments

  1. There is a big problem in your code. The redux logger is still inside your build because of the import statement. So your file size is blown up.

    A better solution is:

    if (process.env.NODE_ENV === ‘development’) {
    middleware = […middleware, thunk, require(‘redux-logger’).default];
    }

Leave a Reply