Redux-devtools-extension: Has anyone had any luck making use of extension in a typescript project

Created on 10 Jun 2016  ·  5Comments  ·  Source: zalmoxisus/redux-devtools-extension

Thanks for this great extension.

I'm having an issue getting the extension working in a typescript project - and can't find any other instances of anyone combining redux, redux-devtools-extension, and typescript.

I'm wondering if it's supported?

Specifically, I'm having typescript complain when I try to update my call to createStore.

See my issue on jaysoo/todomvc-redux-react-typescript for more information and code to replicate the issue.

I'm new to TypeScript, so may be missing something stupid.

question

Most helpful comment

hello all, just in case this is useful to others, i personally found this middleware-less code readable enough:

const store = createStore(
  rootReducer,
  initialState,
  (window as any).__REDUX_DEVTOOLS_EXTENSION__ &&
    (window as any).__REDUX_DEVTOOLS_EXTENSION__()
);

note that you many need to set no-any to false in your tslint.json file

All 5 comments

It doesn't seem related to the extension. That project doesn't support the third argument of createStorebut only old redux API, which will not be supported since Redux 4. So, it wouldn't work with any other middlewares or store enhancers.

For now you can use it like that:

const enhancer = window['devToolsExtension'] ? window['devToolsExtension']()(createStore) : createStore;
const store: IStore<any> = enhancer(rootReducer, initialState);

Thank you so much - that works! :-)

hello all, just in case this is useful to others, i personally found this middleware-less code readable enough:

const store = createStore(
  rootReducer,
  initialState,
  (window as any).__REDUX_DEVTOOLS_EXTENSION__ &&
    (window as any).__REDUX_DEVTOOLS_EXTENSION__()
);

note that you many need to set no-any to false in your tslint.json file

大家好,以防这对其他人有用,我个人发现这个中间件代码足够可读:

const store =  createStore(
   rootReducer,
   initialState,
  (窗口 的 任何)。__REDUX_DEVTOOLS_EXTENSION__  && 
    (窗口 为 任意)。__REDUX_DEVTOOLS_EXTENSION __()
);

请注意,您需要no-any在tslint.json文件中设置为false

Thank you very much. Yes, I did.

I made it working by using following code: (similar to @zalmoxisus code)


const enhancer = (<any>window)['devToolsExtension'] ? (<any>window)['devToolsExtension']()(createStore) : createStore;

const store = enhancer(applicationReducer, applyMiddleware(
    WindowsLogic
));

Was this page helpful?
0 / 5 - 0 ratings