Herramientas de Desarrollo de React

Extensión del navegador

La forma más fácil de depurar sitios web construidos con React es instalar la extensión de las Herramientas de Desarrollo de React. Está disponible para varios de los navegadores más populares:

Ahora, si visitas un sitio web construido con React, verás los paneles de Components (componentes) y Profiler (perfilador o generador de perfiles).

Extensión de las Herramientas de Desarrollo de React

Safari y otros navegadores

Para otros navegadores (por ejemplo, Safari), instala el paquete de npm :

A continuación abre las herramientas de desarrollo desde la terminal:

Luego conecta tu sitio web añadiendo la siguiente etiqueta <script> al inicio del <head> de tu sitio web:

Ahora recarga tu sitio web en el navegador para verlo en las herramientas de desarrollo.

Versión autónoma de las Herramientas de Desarrollo de React

Móvil (React Native)

Para inspeccionar aplicaciones creadas con , puedes usar , el depurador integrado que se integra profundamente con las herramientas de desarrollador de React. Todas las funciones funcionan de forma idéntica a la extensión del navegador, incluyendo el resaltado y la selección de elementos nativos.

Para versiones de React Native anteriores a la 0.76, utiliza la compilación independiente de React DevTools siguiendo la guía de arriba .