React Monitor là gì?

React Monitor là một tiện ích mở rộng Chrome được phát triển bởi reactmonitorfiber, và tính năng chính của nó là "ReactMonitor Quickly visualize React's component tree performance for improved onboarding and debugging What does it do By using…".

Ảnh Chụp Màn Hình của Tiện Ích Mở Rộng

Tải xuống tệp CRX của tiện ích mở rộng React Monitor

Tải xuống các tệp mở rộng React Monitor dưới định dạng crx, cài đặt các tiện ích mở rộng Chrome bằng tay trong trình duyệt hoặc chia sẻ các tệp crx với bạn bè để dễ dàng cài đặt các tiện ích mở rộng Chrome.

Hướng Dẫn Sử Dụng Tiện Ích Mở Rộng

ReactMonitor
Quickly visualize React's component tree performance for improved onboarding and debugging

What does it do
By using the ReactMonitor Chrome DevTool, beginning and experienced developers alike are able to get a visual representation of an existing codebase that they are working on. Built with React, this tool will dynamically traverse the fiber root object behind the scenes, displaying state, props, render times and the type of components on the page.

How to install and run?
Run the NPM package in your own codebase by following the steps below.

- Install the package (npm install reactmonitorfiber)
- Require/Import the package (import reactMonitor from 'reactmonitorfiber')
- Invoke React Monitor with an input of the DOM element that you are rendering the React Element into
const container = document.querySelector('#root');
reactDOM.render(, container);
reactMonitor(container);
- Navigate to the domain of your React application that you will be running React Monitor on
- Open your Chrome Developer Tools and select React Monitor

You are now able to view state changes on your application in real time!

Thông Tin Cơ Bản về Tiện Ích Mở Rộng

Tên	React Monitor
ID	fmmeapmiaceajgihganackickhkomgla
URL Chính Thức	https://chromewebstore.google.com/detail/react-monitor/fmmeapmiaceajgihganackickhkomgla
Mô tả	ReactMonitor Quickly visualize React's component tree performance for improved onboarding and debugging What does it do By using…
Kích Thước Tệp	1.3 MB
Số Lần Cài Đặt	138
Phiên Bản Hiện Tại	0.0.0.1
Cập Nhật Lần Cuối	2020-06-19
Ngày Phát Hành	2020-06-19
Nhà Phát Triển	reactmonitorfiber
Email	[email protected]
Loại Thanh Toán	free
Ngôn Ngữ Được Hỗ Trợ	en-US
manifest.json
{ "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx", "manifest_version": 2, "name": "React Monitor", "version": "0.0.0.1", "devtools_page": "devtools.html", "permissions": [ "activeTab", "contextMenus", "" ], "content_scripts": [ { "matches": [ "" ], "js": [ "contentScript.js" ] } ], "background": { "scripts": [ "backgroundScript.js" ], "persistent": false }, "icons": { "16": ".\/assets\/rm-icon16.png", "48": ".\/assets\/rm-icon-48.png", "128": ".\/assets\/rm-icon-128.png" }, "externally_connectable": { "ids": [ "*" ] }, "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'" }