Якщо ви використовуєте Chrome, відвідайте веб-магазин Chrome і знайдіть «React», потім виберіть «Інструменти розробника React» і натисніть кнопку «Додати до Chrome», щоб установити його. React DevTools також доступний як окрема електронна програма, пакет NPM і доповнення для браузерів Edge і Firefox. 6 травня 2024 р.
Встановіть інструменти розробника React:
- Відкрийте Google Chrome.
- Перейдіть до веб-магазину Chrome.
- У рядку пошуку знайдіть «Інструменти розробника React».
- Знайдіть розширення та натисніть «Додати в Chrome».
- Підтвердьте встановлення, натиснувши «Додати розширення» у спливаючому вікні.
Щоб встановити додаток Create React:
- Відкрийте термінал (командний рядок Windows або PowerShell).
- Створіть нову папку проекту: mkdir ReactProjects і введіть цей каталог: cd ReactProjects.
- Встановіть React за допомогою vite: npm create vite@latest my-react-app — –template react.
Створіть оболонку, щоб додати договір
- Створіть інший XML-файл JavaScript iframeWrapper. jsx.
- Імпортуйте компоненти React та iFrame. …
- Імпортуйте пакет реагування на веб-компонент.
- Створіть клас-оболонку, який розширює компоненти React і iframe, який ви створили.
- Визначте спеціальний елемент за допомогою нового класу.
- За замовчуванням React Query Devtools включаються лише в комплекти під час обробки. оточення …
- За допомогою цього вікна виклику. toggleDevtools() завантажить пакет devtools і покаже їх.
- Для TypeScript вам потрібно буде встановити moduleResolution: 'nodenext' у вашому tsconfig, для чого потрібен принаймні TypeScript v4.
Щоб використовувати його, встановіть або запустіть пакет react-devtools. Він має підключитися до вашого симулятора протягом кількох секунд. Ми рекомендуємо запускати react-devtools через npx, але ви також можете встановити певну версію глобально. Якщо ви віддаєте перевагу уникнути глобальних установок, ви можете додати react-devtools як залежність проекту.
Доступ до інструментів розробника
- Клацніть сторінку правою кнопкою миші та виберіть «Перевірити елемент». Це відображає HTML-код для елемента, який ви клацнули.
- Виберіть Перегляд > Розробник > Інструменти розробника.