TypeError: Undefined: Redux 4 – App Development: Odds and Ends

Redux 4 > createStore > compose

The Error

            TypeError: Cannot read property 'apply' of undefined
            [node_modules/redux/es/redux.js:523]

The Problem and Solution

If you’ve gone through a tutorial in which they suggest adding the Redux Dev Tools in your store.js like this:

            window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

But they’re using it inside of a compose(), you could receive a Type Error for an undefined when the extension is not enabled (or present).
The correct way to implement the Redux Dev Tools within a compose is as follows:

            window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose

I learned this the hard way, and was eventually brought rescue from GitHub user [zalmoxisus].

zalmoxisus also references the docs for this: [1.2 Advanced store setup (middleware and enhancers)]

Code Extract from [`store.js`]

      compose(
        applyMiddleware(...middleware),
        window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
        window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose
      )

A Little Error Verbosity

TypeError: Cannot read property ‘apply’ of undefined

(anonymous function)

node_modules/redux/es/redux.js:523

  520 | 
                
  521 |   return funcs.reduce(function (a, b) {
                
  522 |     return function () {
                
> 523 |       return a(b.apply(undefined, arguments));
                
  524 |     };
                
  525 |   });
                
  526 | }

createStore

node_modules/redux/es/redux.js:87

  84 |     throw new Error('Expected the enhancer to be a function.');
                
  85 |   }
                
  86 | 
                
> 87 |   return enhancer(createStore)(reducer, preloadedState);
                
  88 | }
                
  89 | 
                
  90 | if (typeof reducer !== 'function') {

./src/resources/store.js

src/resources/store.js:9

   6 | 
                
   7 | const middleware = [thunk];
                
   8 | 
                
>  9 | const ourStore = createStore(
                
  10 |   rootReducer,
                
  11 |   initialState,
                
  12 |   compose(

—
Keith D Commiskey
https://keithdc.com

Redux 4 > createStore > compose

The Error

The Problem and Solution

Code Extract from [store.js]

A Little Error Verbosity

Leave a Reply Cancel reply

Code Extract from [`store.js`]