Reactjs Next.js和TypeScript的redux示例

我正在构建一个Next.js应用程序。我正在尝试将它连接到Redux。我尝试了以下内容，但由于它是用JavaScript编写的，所以翻译不好

所以我开始为所有东西创建类型。这是我到目前为止所拥有的

import { NextPage } from 'next';
import React from 'react';
import { Provider } from 'react-redux';

import { RootState } from '../../redux/root-reducer';
import { initializeStore, Store } from '../../redux/store';

let reduxStore: Store;
const getOrInitializeStore = (initialState?: RootState): Store => {
  // Always make a new store if server, otherwise state is shared between requests
  if (typeof window === 'undefined') {
    return initializeStore(initialState);
  }

  // Create store if unavailable on the client and set it on the window object
  if (!reduxStore) {
    reduxStore = initializeStore(initialState);
  }

  return reduxStore;
};

type WithRedux = <P extends RootState>(
  PageComponent: NextPage,
  options: { ssr?: boolean },
) => React.Component<P>;
export const withRedux: WithRedux = (PageComponent, { ssr = true } = {}) => {
  const WithRedux = ({ initialReduxState, ...props }) => {
    const store = getOrInitializeStore(initialReduxState);
    return (
      <Provider store={store}>
        <PageComponent {...props} />
      </Provider>
    );
  };

  // Set the correct displayName in development
  if (process.env.NODE_ENV !== 'production') {
    const displayName =
      PageComponent.displayName || PageComponent.name || 'Component';

    WithRedux.displayName = `withRedux(${displayName})`;
  }

  if (ssr || PageComponent.getInitialProps) {
    WithRedux.getInitialProps = async (
      context: NextPageContext,
    ): Promise<{}> => {
      // Get or Create the store with `undefined` as initialState
      // This allows you to set a custom default initialState
      const reduxStore = getOrInitializeStore();

      // Provide the store to getInitialProps of pages
      context.reduxStore = reduxStore;

      // Run getInitialProps from HOCed PageComponent
      const pageProps =
        typeof PageComponent.getInitialProps === 'function'
          ? await PageComponent.getInitialProps(context)
          : {};

      // Pass props to PageComponent
      return {
        ...pageProps,
        initialReduxState: reduxStore.getState(),
      };
    };
  }

  return WithRedux;
};

WithRedux

reduxStore

我如何解决这些错误并获得要编译的TypeScript

Type '<P extends { readonly [$CombinedState]?: undefined; }>(PageComponent: NextComponentType<NextPageContext, {}, {}>, { ssr }?: { ssr?: boolean | undefined; }) => { ...; }' is not assignable to type 'WithRedux'.
  Type '{ ({ initialReduxState, ...props }: { [x: string]: any; initialReduxState: any; }): Element; displayName: string; getInitialProps(context: any): Promise<{ initialReduxState: unknown; }>; }' is missing the following properties from type 'Component<P, {}, any>': context, setState, forceUpdate, render, and 3 more.

Binding element 'initialReduxState' implicitly has an 'any' type

Property 'reduxStore' does not exist on type 'NextPageContext'.