Store.getState is not a function error while setup in next.js

[rohitmi0023]

This is pretty basic still I am unable to figure out how to setup this package in my application. I am getting the above error. I have read here and there of how to fix it but still have not been able to. This is the store.js fille:-

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { composeWithDevTools } from 'redux-devtools-extension';
import rootreducer from './reducers';
import { persistStore, persistReducer } from 'redux-persist';
import storage from 'redux-persist/lib/storage';

const persistConfig = {
    key: 'root',
    storage,
};
const persistedReducer = persistReducer(persistConfig, rootreducer);
const initialState = {};
const middleware = [thunk];

export default () => {
    let store = createStore(
        rootreducer,
        initialState,
        persistedReducer,
        composeWithDevTools(applyMiddleware(...middleware))
    );
    let persistor = persistStore(store);
    return { store, persistor };
};

This is _app.js file:-

import { Provider } from 'react-redux';
import { createWrapper } from 'next-redux-wrapper';
import { PersistGate } from 'redux-persist/integration/react';
import store from '../store/store';

unction MyApp({ Component, pageProps }) {
    return (
        <Provider store={store}>
            <PersistGate persistor={persistor}>
                <Component {...pageProps} />
            </PersistGate>
        </Provider>
    );
}

const makestore = () => store;
const wrapper = createWrapper(makestore);

export default wrapper.withRedux(MyApp);

[njdullea]

The store you import into your app js is an object {store, persistor} so in the Provider, it needs to be store={store.store} not store={store}

Similarly, for the persist gate it should be persistor={store.persistor}

[maxpaynestory]

export default () => {
    let store = createStore(
        rootreducer,
        initialState,
        persistedReducer,
        composeWithDevTools(applyMiddleware(...middleware))
    );
    let persistor = persistStore(store);
    return { store, persistor };
};

Rewrote this to

       export let store = createStore(
        rootreducer,
        initialState,
        persistedReducer,
        composeWithDevTools(applyMiddleware(...middleware))
    );
    export let persistor = persistStore(store);

then use

import {store, persistor} from '../store/store';

[Orisland]

export default () => {
  let store = createStore(
      rootreducer,
      initialState,
      persistedReducer,
      composeWithDevTools(applyMiddleware(...middleware))
  );
  let persistor = persistStore(store);
  return { store, persistor };
};

Rewrote this to

       export let store = createStore(
      rootreducer,
      initialState,
      persistedReducer,
      composeWithDevTools(applyMiddleware(...middleware))
  );
  export let persistor = persistStore(store);

then use

import {store, persistor} from '../store/store';

It works! Thank you so much!