React Developer Tools
Utiliza React Developer Tools para inspeccionarcomponentesde React, editarprops y estado, e identificar problemas de rendimiento.
Aprenderás
- Cómo instalar React Developer Tools
Extensión del navegador
La forma más fácil de depurar sitios web construidos con React es instalar la extensión del navegador React Developer Tools. Está disponible para varios navegadores populares:
Ahora, si visitas un sitio webconstruido con React,verás los panelesComponents y Profiler.
Safari y otros navegadores
Para otros navegadores (por ejemplo, Safari), instala el paquete npmreact-devtools:
Luego, abre las herramientas de desarrollo desde la terminal:
Luego conecta tu sitio web añadiendo la siguiente etiqueta<script>al principio del<head>de tu sitio web:
Ahora, recarga tu sitio web en el navegador para verlo en las herramientas de desarrollo.
Móvil (React Native)
Para inspeccionar aplicaciones construidas conReact Native, puedes usarReact Native DevTools, el depurador integrado que incorpora profundamente React Developer Tools. Todas las funciones funcionan de manera idéntica a la extensión del navegador, incluido el resaltado y selección de elementos nativos.
Aprende más sobre depuración en React Native.
Para versiones de React Native anteriores a la 0.76, por favor utiliza la versión independiente de React DevTools siguiendo la guía deSafari y otros navegadoresanterior.