Uncaught Typeerror: Providing Your Root Epic To Createepicmiddleware(rootepic)

I am getting this error Uncaught TypeError: Providing your root Epic to createEpicMiddleware(rootEpic) is no longer supported, instead use epicMiddleware.run(rootEpic) When

Solution 1:

First, take a look at this document: Official Redux-Observable Document because we're using the newest version of Redux-Observable, then reviewing its document is quite helpful.

After reviewing the document, let's see a small example project (Counter app):

This is the root.js file which contains my Epics and Reducers after bundling.

// This is a sample reducers and epics for a Counter app.import { combineEpics } from'redux-observable';
import { combineReducers } from'redux';


import counter, {
  setCounterEpic,
  incrementEpic,
  decrementEpic
} from'./reducers/counter';

// bundling Epicsexportconst rootEpic = combineEpics(
  setCounterEpic,
  incrementEpic,
  decrementEpic
);

// bundling Reducersexportconst rootReducer = combineReducers({
  counter
});

And this is store.js where I define my store before using it.

import { createStore, applyMiddleware } from'redux';
import { createEpicMiddleware } from'redux-observable';
import { rootEpic, rootReducer } from'./root';
import { composeWithDevTools } from'redux-devtools-extension';

const epicMiddleware = createEpicMiddleware();

const middlewares = [
  epicMiddleware
]

const store = createStore(
  rootReducer,
  composeWithDevTools(applyMiddleware(middlewares))
);

epicMiddleware.run(rootEpic);

exportdefault store;

In order to successfully implement redux-observable, we have to obey this order:

1. Creating epicMiddleware using createEpicMiddleware() method
2. Using the applyMiddleware() method to register the epicMiddleware (the redux-devtools-extension is optional)
3. Calling the epicMiddleware.run() with the rootEpic we created earlier.

This is the instruction from the Redux-Observable Document

For more information, you could find it here: : Setting Up The Middleware:

Solution 2:

Try this

import'rxjs'import { createStore, combineReducers, applyMiddleware } from'redux'import { reducer as formReducer } from'redux-form'import thunk from'redux-thunk'import promise from'redux-promise-middleware'import { createEpicMiddleware, combineEpics } from'redux-observable'import app from'./app'// Bundling Epicsconst rootEpic = combineEpics(
)

// Creating Bundled Epicconst epicMiddleware = createEpicMiddleware();

// Define Middlewareconst middleware = [
  thunk,
  promise(),
  epicMiddleware
]

// Define Reducersconst reducers = combineReducers({
  form: formReducer
})

// Create Storeconst store = createStore(reducers,window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(), applyMiddleware(...middleware))
epicMiddleware.run(rootEpic);
exportdefault store

official documentation createEpicMiddleware.

Solution 3:

Well, have you tried:

import { epicMiddleware, combineEpics } from'redux-observable'const epicMiddleware = epicMiddleware.run(rootEpic)

?