reactjs - 使用 TS : "Property ' __REDUX_DEVTOOLS_EXTENSION_COMPOSE_ _' does not exist on type ' Window'. 的 Redux DevTools 扩展出错？

Question

我在 index.tsx 上遇到了这个错误。

“窗口”类型不存在属性“REDUX_DEVTOOLS_EXTENSION_COMPOSE”。

这是我的 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。非常感谢您提供有关提前发生的事情的任何提示。

Answer 1

这是 this question 的特例. Redux 不为 __REDUX_DEVTOOLS_EXTENSION_COMPOSE__ 提供类型，因为这个函数是由 Redux DevTools 公开的，而不是 Redux 本身。

它是:

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;

这已经由 @redux-devtools/extension 完成了包含 TypeScript 类型的包。如果已安装，则应使用其导入而不是手动访问 __REDUX_DEVTOOLS_EXTENSION_COMPOSE__。