React+TS项目无法从window对象导出Redux Devtools问题咨询

你提供的index.d.ts语法本身没有问题，无法识别window上的DevTools属性通常是配置或使用方式问题，可按以下步骤排查解决：

• 确认声明文件被TS正确加载
  检查tsconfig.json的include配置项，确保包含了你存放index.d.ts的目录。比如声明文件放在src/types/index.d.ts，配置参考如下：

  {
    "include": ["src/**/*", "src/types/**/*.d.ts"]
  }
  

  修改配置后重启TypeScript服务（VS Code中可通过快捷键Ctrl+Shift+P调出命令面板，执行「Restart TypeScript Server」）验证是否生效。

• 调整DevTools调用写法
  优先从window对象上读取属性，避免直接使用全局变量可能带来的作用域问题，store配置参考写法：

  import { createStore, compose, applyMiddleware } from 'redux';
  import rootReducer from './reducers';
  
  const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?? compose;
  const store = createStore(rootReducer, composeEnhancers(applyMiddleware(/* 你的中间件列表 */)));
  
  export default store;
  

• 使用官方类型包替代自定义声明
  不想手动维护类型的话，可以直接安装Redux DevTools的官方类型包，会自动注入全局类型定义：

  npm i @types/redux-devtools-extension -D
  

  安装完成后可以删除你自己写的__REDUX_DEVTOOLS_EXTENSION_COMPOSE__相关声明代码，TS会自动识别window上的对应属性。

• 兜底类型断言方案
  如果以上方法都无法解决，可以使用类型断言临时规避类型报错，不影响运行逻辑：

  const composeEnhancers = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
  

补充说明：如果你使用的是Redux Toolkit，不需要手动配置Redux DevTools，configureStore接口默认已经集成了DevTools能力，也不需要额外处理类型问题。

内容的提问来源于stack exchange，提问作者user16657995