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!