title: Before running a Saga, you must mount the Saga middleware on the Store using applyMiddleware with redux tool
body: <p>Can someone help with this,<br>
  <code>Error: Before running a Saga, you must mount the Saga middleware on the Store using applyMiddleware</code></p>
  
  <p>Mounted sagaMiddleware still it throw an error on the page <br>
  Added redux-saga to Store with saga Middleware <br>
  Store Js</p>
  
  <pre><code>import { createStore, applyMiddleware, compose } from "redux";
  import { persistStore } from "redux-persist";
  import createSagaMiddleware from 'redux-saga'
  import {fetchCollectionsStart} from './shop/shop.sagas'
  import logger from "redux-logger";
  import rootReducer from "./root-reducer";
  
  const sagaMiddleware = createSagaMiddleware();
  
  const middlewares = [sagaMiddleware];
  
  if (process.env.NODE_ENV === "development") {
    middlewares.push(logger);
  }
  const composeEnhancers =
    typeof window === "object" &amp;&amp; window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
      ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
          // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize...
        })
      : compose;
  
  const enhancer = composeEnhancers(
    applyMiddleware(...middlewares,sagaMiddleware)
    // other store enhancers if any
  );
  
  sagaMiddleware.run(fetchCollectionsStart);
  
  export const store = createStore(rootReducer, enhancer);
  export const persistor = persistStore(store);
  </code></pre>
  
  <p>Created this saga to fetch the collections once the component is mounted <br>
  Sagas.js</p>
  
  <pre><code>import {takeEvery} from 'redux-saga/effects';
  import ShopActionTypes from './shop.types';
  
  export function* fetchCollectionsAsync(){
      yield console.log('Good');
  }
  export function* fetchCollectionsStart(){
      yield takeEvery(ShopActionTypes.FETCH_COLLECTIONS_START,
          fetchCollectionsAsync );
  }
  </code></pre>