Javascript Next.js、Redux、Redux saga、@reduxjs/toolkit make store-没有重载匹配此调用

Javascript Next.js、Redux、Redux saga、@reduxjs/toolkit make store-没有重载匹配此调用,javascript,reactjs,react-redux,next.js,redux-saga,Javascript,Reactjs,React Redux,Next.js,Redux Saga,嗨,我正在配置redux商店,我需要做一些这样的思考 import { configureStore, getDefaultMiddleware } from '@reduxjs/toolkit' import createSagaMiddleware from 'redux-saga' import logger from 'redux-logger' import { reduxBatch } from '@manaflair/redux-batch'; import rootSaga

嗨,我正在配置redux商店,我需要做一些这样的思考

import { configureStore, getDefaultMiddleware } from '@reduxjs/toolkit'
import createSagaMiddleware from 'redux-saga'
import logger from 'redux-logger'
import { reduxBatch }  from '@manaflair/redux-batch';

import rootSaga from '../sagas/root-saga'

import rootReducer from './rootReducer'

const makeStore = (initialState, options) => {
    const sagaMiddleware = createSagaMiddleware()

    const middleware = [...getDefaultMiddleware(), logger, sagaMiddleware]

    const preloadedState = {}

    const store = configureStore({
        reducer: rootReducer,
        middleware,
        devTools: process.env.NODE_ENV !== 'production',
        preloadedState,
        enhancers: [reduxBatch]
    })

    sagaMiddleware.run(rootSaga)

    return store
}

// export type AppDispatch = typeof makeStore.dispatch

export type AppStore = typeof makeStore

export default makeStore
我想使用redux传奇,@reduxjs/toolkit,Next.js,redux

\u app.tsx

import React from 'react'
import { Container, AppProps } from 'next/app'
import { Provider } from 'react-redux'
import withRedux from 'next-redux-wrapper'
import withReduxSaga from 'next-redux-saga'
import { ConnectedRouter } from 'connected-next-router'

import GlobalStyles from '../src/globalStyles'
// import { ErrorBoundary } from '../src/components/ErrorBoundary'
import makeStore, { AppStore } from '../src/store'

interface Props extends AppProps {
    store: AppStore
}

const MyApp = ({ Component, pageProps, store }: Props) => {
    return (
        <Container>
            <Provider store={store}>
                <ConnectedRouter>
                    <GlobalStyles/>
                    {/*<ErrorBoundary>*/}
                    {/*<Layout>*/}
                    <Component {...pageProps} />
                    {/*</Layout>*/}
                    {/*</ErrorBoundary>*/}
                </ConnectedRouter>
            </Provider>
        </Container>
    )
}

export default withRedux(makeStore)(withReduxSaga(MyApp))

const makeStore = () => store

export default withRedux(makeStore)(withReduxSaga(MyApp))
并已更改
\u app.tsx

import React from 'react'
import { Container, AppProps } from 'next/app'
import { Provider } from 'react-redux'
import withRedux from 'next-redux-wrapper'
import withReduxSaga from 'next-redux-saga'
import { ConnectedRouter } from 'connected-next-router'

import GlobalStyles from '../src/globalStyles'
// import { ErrorBoundary } from '../src/components/ErrorBoundary'
import makeStore, { AppStore } from '../src/store'

interface Props extends AppProps {
    store: AppStore
}

const MyApp = ({ Component, pageProps, store }: Props) => {
    return (
        <Container>
            <Provider store={store}>
                <ConnectedRouter>
                    <GlobalStyles/>
                    {/*<ErrorBoundary>*/}
                    {/*<Layout>*/}
                    <Component {...pageProps} />
                    {/*</Layout>*/}
                    {/*</ErrorBoundary>*/}
                </ConnectedRouter>
            </Provider>
        </Container>
    )
}

export default withRedux(makeStore)(withReduxSaga(MyApp))

const makeStore = () => store

export default withRedux(makeStore)(withReduxSaga(MyApp))