Инструменты разработчика React
Используйте Инструменты разработчика React для проверкикомпонентовReact, редактирования ихпропсов и состояния, а также для выявления проблем с производительностью.
Вы узнаете
- Как установить Инструменты разработчика React
Расширение для браузера
Самый простой способ отладки сайтов, созданных с помощью React, — установить расширение для браузера «Инструменты разработчика React». Оно доступно для нескольких популярных браузеров:
Теперь, если вы посетите сайт,созданный с помощью React,вы увидите панелиComponents и Profiler.
Safari и другие браузеры
Для других браузеров (например, Safari) установите npm-пакетreact-devtools:
Затем откройте инструменты разработчика из терминала:
Затем подключите ваш сайт, добавив следующий тег<script> в начало <head>вашего сайта:
Теперь перезагрузите ваш сайт в браузере, чтобы просмотреть его в инструментах разработчика.
Мобильные приложения (React Native)
Для проверки приложений, созданных с помощьюReact Native, вы можете использоватьReact Native DevTools— встроенный отладчик, который глубоко интегрирует Инструменты разработчика React. Все функции работают идентично расширению для браузера, включая подсветку и выбор нативных элементов.
Подробнее об отладке в React Native.
Для версий React Native ранее 0.76 используйте автономную сборку React DevTools, следуя руководству выше дляSafari и других браузеров.