更新到最新的 Redux Dev Tools 扩展后，我得到："Symbol.observable as defined by Redux and Redux DevTools do not match."

Question

对于从 redux 开发工具 chrome 扩展程序获取最新更新后的一些未知问题，我收到以下警告消息：

Symbol.observable as defined by Redux and Redux DevTools do not match. This could cause your app to behave differently if the DevTools are not loaded. Consider polyfilling Symbol.observable before Redux is imported or avoid polyfilling Symbol.observable altogether.

通过阅读错误消息，我了解到 redux 和 redux 开发工具应该使用相同的 Symbol.observable 但它们不是。这很奇怪，因为我没有更改我的代码中的任何内容，并且我正在按照 documentation.

使用代码

我的问题是你是否知道我应该去哪个方向？这是我们只需要报告的 chrome 扩展错误吗？

我正在使用名称为 Redux DevTools 的最新 chrome 扩展。我注意到，如果我卸载 chrome 开发工具扩展，则此警告消息不会再出现。

我的代码如下所示：

  // The redux-devtools-extension is renamed to this npm package
  import { composeWithDevTools } from "@redux-devtools/extension"; 

  // Some code here ...

  const composeEnhancersPersonalProject = composeWithDevTools({
    name: `My Project`,
  });

  // Some other code here ...
  
  const myStore = createStore(
    persistedReducer,
    composeEnhancersPersonalProject(
      applyMiddleware(serverRequestMiddleware, rehydrateMiddleware)
    )
  );

Answer 1

这是最近几天刚添加到 Redux DevTools 代码中的全新检查和警告：

https://github.com/reduxjs/redux-devtools/issues/1002#issuecomment-1011097465

如果您仍在使用 Redux 4.0.5 或更早版本，升级到 Redux 4.1.x 可能会修复此警告（因为 4.1.0 删除了 symbol-observable polyfill).

就是说，您应该真正使用our official Redux Toolkit package来设置 Redux 存储并编写您的 Redux 逻辑，而不是使用原始核心 createStore 直接方法。

Answer 2

经过几个小时的研究和反复试验后，我终于找到了这个警告的 work-around。

根据 github comment，您可以在 React/Redux 项目的开头添加以下行：

// eslint-disable-next-line
import Symbol_observable from 'symbol-observable';

似乎出于某种奇怪的原因，我的项目没有填充 Symbol observable，所以如果我们添加 npm 库 symbol-observable，警告就会消失。

好消息是尝试使用模板 redux（例如 npx create-react-app my-app --template redux）的最新 create-react-app 项目，问题不再存在。所以它应该与@markerikson在我的项目中特别提到的版本组合有关。

更新到最新的 Redux Dev Tools 扩展后，我得到："Symbol.observable as defined by Redux and Redux DevTools do not match."

After updating to the latest Redux Dev Tools extension I am getting: "Symbol.observable as defined by Redux and Redux DevTools do not match."

javascript

google-chrome-extension

redux

redux-devtools

redux-devtools-extension