0

I got following erros in my next.js 13 project please help me to fix this problem.

[1] - error src\redux\store.js (12:15) @ localStorage 

[1] - error ReferenceError: localStorage is not defined

this is how it looks in my terminal

enter image description here

this is my store.js file

`import { createStore, combineReducers, applyMiddleware } from "redux";
import thunk from "redux-thunk";
import { composeWithDevTools } from "redux-devtools-extension";
import { rootReducer } from "./rootReducer";

const finalReducer = combineReducers({
  rootReducer,
});

const intialState = {
  rootReducer: {
    cartItems: localStorage.getItem("cartItems")
      ? JSON.parse(localStorage.getItem("cartItems"))
      : [],
  },
};

const middleware = [thunk];

const store = createStore(
  finalReducer,
  intialState,
  composeWithDevTools(applyMiddleware(...middleware))
);

export default store;`

please help me to fix this error

Nuwan Chamikara
  • 433
  • 1
  • 5
  • 17

1 Answers1

0

Maybe it's just a hydration issue? Window.localstorage is a browser reserved variable but not so for server. Couldn't you just give a default value that both server and browser can consume and then once browser loads you update the variable? ( for example with a useEffect )

Zylah
  • 11
  • 2
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jul 31 '23 at 12:44