Redux DevTools不显示状态需检查store创建方式：必须显式启用devTools增强器，如configureStore({devTools: true})或composeWithDevTools；确认Chrome扩展已加载且页面为http协议；验证window.__REDUX_DEVTOOLS_EXTENSION__是否存在。
WebStorm 调试时 Redux DevTools 不显示状态？检查 store 创建方式
Redux DevTools 插件不会自动捕获 store，除非你显式接入它。WebStorm 本身不干预 Redux 的运行时逻辑，所以关键在 createStore 或 configureStore 是否正确启用了 DevTools 增强器。
常见错误是只装了 Chrome 扩展，但代码里没调用 composeWithDevTools 或没开 devTools: true：
- 用 Redux Toolkit：确保
configureStore({ reducer, devTools: true })—— 默认就是true，但显式写出来更保险 - 手写 store：必须用
composeWithDevTools(applyMiddleware(...))，不能只用原生compose - 如果用了自定义 enhancer（比如 saga middleware），要确认它没覆盖或屏蔽 DevTools 的增强逻辑
Chrome 扩展已安装，但 WebStorm 启动的页面打不开 Redux 标签页？
不是所有页面都会触发 Redux DevTools 面板。它只在检测到全局 window.__REDUX_DEVTOOLS_EXTENSION__ 或监听到符合规范的 store 初始化时才激活。
验证方法：
- 在 WebStorm 启动的页面中按
F12→ 切换到Redux标签页；如果看不到，说明扩展没识别到 store - 在控制台输入
window.__REDUX_DEVTOOLS_EXTENSION__—— 返回函数说明扩展已加载；返回undefined是扩展未启用或被广告拦截器屏蔽 - 检查 URL 是否为
http://localhost:xxxx（非file://协议），否则扩展默认禁用
WebStorm + Chrome 联调时 action 不记录？注意 source map 和异步中间件
Redux DevTools 记录的是 dispatch 的原始 action 对象，但如果你用了 redux-thunk、redux-saga 或 RTK Query，实际 dispatch 的可能是函数或 Promise，这些不会被直接记录。
解决方案：
- 确保中间件包装正确：thunk 应该放在
applyMiddleware里，且顺序不影响 DevTools 拦截（它在最外层） - 开启 source map：在 WebStorm 的
Settings → Languages & Frameworks → JavaScript → Source Maps中勾选 “Enable source maps” 并配置路径映射 - 避免在 reducer 里做副作用操作（如直接修改 state），否则时间旅行会失效，DevTools 可能跳过该 action
为什么时间旅行回退后 UI 没变化？
Redux DevTools 的时间旅行本质是重放 action 序列并重新计算 state，但它不主动触发 React 组件的 re-render。能否响应取决于你的 UI 层是否真正订阅了 store。
典型问题：
- 用了
useSelector但 selector 返回引用相等的对象（比如没用shallowEqual或没做 memoization），导致组件不更新 - 手动调用
store.getState()而非通过Provider+connect/useSelector订阅，DevTools 修改 state 后 UI 不感知 - 使用了不可变更新但 reducer 返回了新对象，而组件依赖旧引用（比如深比较失败）
最易忽略的一点：DevTools 的“锁定”开关（Lock icon）一旦开启，dispatch 就被暂停，时间旅行也不会触发 re-render —— 检查右上角图标是否灰掉。
