Rematch Loading Typescript keep getting Reducer "loading" returned undefined during initialization

Question

I'm using @rematch/core and @rematch/loading for my redux.

Currently facing some issue. When I put loading plugin keep returning me Reducer "loading" returned undefined during initialization.

import {
    init, RematchDispatch, RematchRootState,
} from '@rematch/core';
import { createBrowserHistory } from 'history';
import { connectRouter } from 'connected-react-router';
import loading from '@rematch/loading';
import { models, RootModel } from './models';

const history = createBrowserHistory();
const loadingPlugin = loading({});

const rootReducer = () => ({
    router: connectRouter(history),
});

export const store = init({
    models,
    plugins: [loadingPlugin],
    redux: {
        reducers: rootReducer(),
    },
});


export type Store = typeof store;
export type RootDispatch = RematchDispatch<RootModel>;
export type RootState = RematchRootState<RootModel>;

Any solution?

Thanks.

Answer 1

Since Rematch version v2.x.x you can get fully typed plugins, here is an example for getting typed loading plugin:

import loadingPlugin, { ExtraModelsFromLoading } from '@rematch/loading'
import { init, RematchDispatch, RematchRootState } from '@rematch/core'
import { models, RootModel } from './models'

type FullModel =  ExtraModelsFromLoading<RootModel>

export const store = init<RootModel, FullModel>({
    models,
      plugins: [loadingPlugin()],
})

In the same way works for @rematch/updated, you can check more on the new documentation site: https://rematchjs.org/docs/plugins/loading/