As I delve into learning how redux-observables work with typescript, I've been following a project example and referencing various guides like those found here and here. However, no matter what I try in setting up the epics/middleware, I keep encountering the same error message:
Uncaught TypeError: this.schedulerActionCtor is not a constructor
at QueueScheduler.Scheduler.schedule (Scheduler.js?ef44:10)
at eval (observeOn.js?142b:6)
...
Below is the code snippet I'm attempting to troubleshoot while setting up the middleware.
example/epics.ts:
import { delay, filter, mapTo } from 'rxjs/operators'
import { isOfType } from "typesafe-actions"
import { ExampleActionTypes } from './types'
import * as exampleActions from './actions'
export const pingEpic: Epic<RootAction, RootAction, RootState> = (action$) => action$.pipe(
filter(isOfType(ExampleActionTypes.PING)),
delay(1000), // Asynchronously wait 1000ms then continue
mapTo(exampleActions.pong())
)
export const buttonEpic: Epic<RootAction, RootAction, RootState> = (action$) => action$.pipe(...)
export default {
pingEpic,
buttonEpic
}
In rootEpic.ts:
import { combineEpics } from 'redux-observable';
import {
pingEpic,
buttonEpic
} from './example/epics';
export default combineEpics(
pingEpic,
buttonEpic
)
And in store.ts:
...
export const epicMiddleware = createEpicMiddleware<RootAction, RootAction, RootState>()
const middlewares = [epicMiddleware]
const enhancer = composeEnhancers(applyMiddleware(...middlewares))
const store = createStore(
rootReducer,
initialState,
enhancer
)
epicMiddleware.run(rootEpic)
...
The package versions from package.json are:
"redux": "4.1.0",
"redux-observable": "1.2.0",
"typesafe-actions": "5.1.0"
If I comment out the epicMiddleware.run(rootEpic) line, the error disappears. It seems there's a mismatch in types or perhaps a step I'm overlooking. Can anyone spot where things might be going awry?