Redux-Persist rehydrates on main page but fails on different routes

I’m trying to implement redux-persist with reduxjs/toolkit. I made it possible to persist the store on main page. However, when I route to MemeForm.jsx different paths in my app where I make another api call to fetch data from the server (which changes the redux-store since this api call adds another slice to the store) and refresh the page it gets crashed. It works perfectly in my local computer, though. I guess I couldn’t implement redux-persist with reduxjs/toolkit correctly. I can’t figure out this problem for a week. A little bit of help would be perfect.

Here is my github repo GitHub - ahmettulutas/MemeGeneratorV2: New Version of my MemeGenerator project. It utilizes reduxjs/toolkit, react-router-dom v6 and redux-persist. and here is the netlify version of the app. https://memegeneratorv2.netlify.app

1 Like

Hey @ahmetulutas,

Could you tell us how to reproduce this error? I tried to select a meme, add some text, went back to main page, chose another meme and so on. But it all appears to work fine for me.

@ahmetulutas same problem with me working fine on localhost but crashing(on refresh) on netlify or firebase hosting… if you find the solution let me know

When replying to old threads, it would be great if you can answer the question that the previous person has left unanswered otherwise, we’re still at the same point. :slight_smile:

Yeah, I have already did. You need to add netlify.toml file to redirect your netlify app to your main page when user refreshes hard. You can copy and paste a sample file from my repo GitHub - ahmettulutas/MemeGeneratorV2: New Version of my MemeGenerator project. It utilizes reduxjs/toolkit, react-router-dom v6 and redux-persist.