web-dev-qa-db-ja.com

誰かがredux開発ツールを使用してTSでこのエラーに遭遇しましたか? "プロパティ '__REDUX_DEVTOOLS_EXTENSION_COMPOSE__'はタイプ 'ウィンドウ'に存在しません。

Index.tsxでこのエラーが発生します。

プロパティ 'REDUX_DEVTOOLS_EXTENSION_COMPOSE'はタイプ 'Window'に存在しません。

これが私のindex.tsxコードです:

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import App from './App';
import './index.css';
import registerServiceWorker from './registerServiceWorker';

import { Provider } from 'react-redux';

import { createStore, compose, applyMiddleware } from 'redux';
import rootReducer from './store/reducers';

import thunk from 'redux-thunk';

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

 const store = createStore(rootReducer, composeEnhancers(
     applyMiddleware(thunk)
 ));

ReactDOM.render(  <Provider store={store}><App /></Provider>, document.getElementById('root'));

registerServiceWorker();

@ types/npm install --save-dev redux-devtools-extensionをインストールし、create-react-app-TypeScriptを使用しています。事前に行われていることについてのヒントをたくさんありがとう。

21
justkeithcarr

これは この質問 の特殊なケースです。この関数はRedux自体ではなくRedux DevToolsによって公開されるため、Reduxは__REDUX_DEVTOOLS_EXTENSION_COMPOSE__のタイプを提供していません。

次のいずれかです。

const composeEnhancers = window['__REDUX_DEVTOOLS_EXTENSION_COMPOSE__'] as typeof compose || compose;

または:

declare global {
    interface Window {
      __REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: typeof compose;
    }
}

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

これは、TypeScriptタイピングを含む redux-devtools-extension パッケージによってすでに行われています。インストールされている場合は、手動で__REDUX_DEVTOOLS_EXTENSION_COMPOSE__にアクセスする代わりに、そのインポートを使用する必要があります。

3
estus

同じ問題が変更されたのですが、変更しました

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() || compose

createStore(reducer, initial state, compose(applyMiddlewareの使用時にundefinedの適用問題を回避する

0
mmunier44