CODEWITHSUNDEEP
reactjsreduxreact-reduxnext.jsredux-thunk
RRR uzumaki
RRR uzumaki

Reputation: 1328

Getting rid of console logs in redux wrapper with Next.js

Hey guys I just downloaded some source file from internet which uses redux thunk with Next.js in order to see how things work and then after running it with npm run dev the project runs successfully but then in console I keep getting this logs:

1. WrappedApp.getInitialProps wrapper got the store with state {
  loginAndSignupReducer: [],
  getCategoryReducer: { loading: false, err: false, data: [] },
  MyStoryReducer: { loading: false, err: false, data: [] },
  reportStoryReducer: { loading: false, err: false, data: [] },
  getAllDetails: []
}
3. WrappedApp.getInitialProps has store state {
  loginAndSignupReducer: [],
  getCategoryReducer: { loading: false, err: false, data: [] },
  MyStoryReducer: { loading: false, err: false, data: [] },
  reportStoryReducer: { loading: false, err: false, data: [] },
  getAllDetails: []
}
4. WrappedApp.render created new store with initialState {
  loginAndSignupReducer: [],
  getCategoryReducer: { loading: false, err: false, data: [] },
  MyStoryReducer: { loading: false, err: false, data: [] },
  reportStoryReducer: { loading: false, err: false, data: [] },
  getAllDetails: []
}

These things get rendered first of all and so because of this. I also see them in page source as objects

I have shared an image below please refer to it, I rendered my id in <p> tag but then here I am seeing it as object.

I rendered my ID in tag but here i am seeing it as object

Does anyone from where to get rid of them permanently?

Upvotes: 3

Views: 1431

Answers (2)

troglodytto
troglodytto

Reputation: 121

There are two reasons for this that I can think of, either the Debug Property is set to false during the wrapper creation. To Fix that, do this

// From This
const wrapper = createWrapper<RootState>(initializeStore, { debug: true })

// To This
const wrapper = createWrapper<RootState>(initializeStore, { debug: false })

// Or Rather
const wrapper = createWrapper<RootState>(initializeStore)

Or you might have some middleware like "logger" in your State. So if that's the case get rid of any middleware you don't need. Logger can be replaced with redux-devtools-extension

Upvotes: 0

NearHuscarl
NearHuscarl

Reputation: 81520

This is most likely because you copy the code sample from the docs which sets debug to true when you create a wrapper:

export const wrapper = createWrapper<State>(makeStore, {debug: true});

Remove the debug property or set it to false to fix the issue

export const wrapper = createWrapper<State>(makeStore);

Live Demo

Edit 61159443/getting-rid-of-console-logs-in-redux-wrapper-with-next-js

Upvotes: 4

Related Questions