Realize for React
A React component tree visualizer
什麼是Realize for React？
Realize for React是由Realize for React開發的Chrome擴展程式，該擴展的主要功能是“A React component tree visualizer”。
擴展截圖
下載Realize for React擴展crx文件
下載Realize for React擴展crx格式的文件，手動將Chrome擴充功能安裝到瀏覽器中，也可以將crx文件分享給朋友，輕鬆安裝Chrome擴充功能。
擴展使用說明
As React applications scale, it becomes more difficult to track state and to have a holistic overview of the component hierarchy. Realize is a tool to help developers visualize the structure and state flow of their React applications, especially when they are growing in scale and complexity. It currently supports React v.16.8.
Prerequisites
1. You must have React Dev Tools installed to use Realize for React. Install it from the Chrome store
2. Realize is best used on non-deployed applications. This uglification of deployed websites makes the component structure pretty unreadable.
How to use
1. Click the blue 'Add to Chrome' button
2. Once installed, navigate to your React website
3. Open the dev tools window and click on the Realize panel
4. Trigger a state change to populate the component tree
Functionality:
- Utilize the search bar to search for any component that exists in the tree.
- Clicking a node component will display information about state, children, props, and hooks in the right hand panel.
- You can zoom and pan the tree by holding shift and dragging/scrolling
- Click the 'State' button to view the flow of state through the component tree 擴展基本資訊
| 名稱 |  Realize for React |
| ID | llondniabnmnappjekpflmgcikaiilmh |
| 官方網址 | https://chromewebstore.google.com/detail/realize-for-react/llondniabnmnappjekpflmgcikaiilmh |
| 簡介 | A React component tree visualizer |
| 檔案大小 | 160 KB |
| 安裝次數 | 5,086 |
| 目前版本 | 1.0.0.0 |
| 更新時間 | 2020-06-20 |
| 上架時間 | 2020-06-20 |
| 評分 | 1.88/5 共 8 次評分 |
| 開發者 | Realize for React |
| 電子郵箱 | [email protected] |
| 付費類型 | free |
| 擴展官網 | http://www.realizeforreact.com |
| 說明頁面URL | http://www.realizeforreact.com |
| 支援的語言 | en-US |
| manifest.json | |
{
"update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
"manifest_version": 2,
"name": "Realize for React",
"version": "1.0.0.0",
"description": "A React component tree visualizer",
"icons": {
"16": "16.png",
"32": "32.png",
"48": "48.png",
"128": "128.png"
},
"permissions": [
"activeTab",
" | |
