typescriptreduxredux-devtoolsredux-devtools-extension

Working with Redux Dev Tools extension and Typescript

I'm converting my project to Typescript.

This has always worked for me in JS.

/* ##################### */
/* #### REDUX STORE #### */
/* ##################### */

const store = createStore(rootReducer, {
  // INITIAL STATE GOES HERE
},window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());

But in Typescript I'm getting these errors:

enter image description here

enter image description here

enter image description here

How can I fix this?

Solution

  • The error is getting throw from the TS compiler because it doesn't know about REDUX_DEVTOOLS_EXTENSION property on the Window object. You can extend the Window interface and add that which will make the TS compiler happy. Or you can do this:

    createStore(rootReducer,{//INITIAL STATE GOES HERE},composeWithDevTools());

    cite: https://redux.js.org/recipes/configuring-your-store#integrating-the-devtools-extension