Por algún problema desconocido después de obtener la última actualización de la extensión de cromo de las herramientas de desarrollo de redux, recibo el siguiente mensaje de advertencia:
Symbol.observable según lo definido por Redux y Redux DevTools no coinciden. Esto podría hacer que su aplicación se comporte de manera diferente si las DevTools no están cargadas. Considere la posibilidad de polillenar Symbol.observable antes de importar Redux o evitar polirrelleno de Symbol.observable por completo.
Al leer el mensaje de error, entiendo que las herramientas de desarrollo redux y redux deberían usar el mismo símbolo.observable pero no lo son. Sin embargo, es muy extraño ya que no he cambiado nada dentro de mi código y estoy usando el código según la documentación .
Mi pregunta es si tienes alguna idea de en qué dirección debo ir. ¿Es este un error de extensión de Chrome que solo debemos informar?
Estoy usando la última extensión de Chrome con el nombre Redux DevTools . He notado que si desinstalo la extensión Chrome Dev-Tool, este mensaje de advertencia ya no aparece.
Mi código se ve así:
// 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) ) );Esta es una verificación y advertencia completamente nueva que se acaba de agregar al código de Redux DevTools en los últimos días:
https://github.com/reduxjs/redux-devtools/issues/1002#issuecomment-1011097465
Si aún usa Redux 4.0.5 o anterior, es posible que la actualización a Redux 4.1.x solucione esta advertencia (porque 4.1.0 eliminó el uso del relleno poligonal symbol-observable ).
Dicho esto, realmente debería usarnuestro paquete oficial Redux Toolkit para configurar la tienda Redux y escribir su lógica Redux, en lugar de usar directamente el método core createStore original.
Después de pasar un par de horas investigando y haciendo algunas pruebas y errores, finalmente encontré una solución para esta advertencia.
Según el comentario de github , puede agregar las siguientes líneas al comienzo de su proyecto React/Redux:
// eslint-disable-next-line import Symbol_observable from 'symbol-observable';Parece que, por una extraña razón, mi proyecto no rellena el símbolo observable, por lo que si agregamos el símbolo observable de la biblioteca npm, la advertencia desaparecerá.
La buena noticia es que al probar el último proyecto create-react-app con plantilla redux (por ejemplo npx create-react-app my-app --template redux ), el problema ya no existe. Por lo tanto, debería tener que ver con una combinación de versiones como mencionó @markerikson dentro de mi proyecto específicamente.