React code finder

React开发人员的Chrome扩展

激活开发环境中的扩展名，并[右键单击]立即查找和修改组件的源代码！

*******************************************

##简介
React Code Finder是为Chrome设计的强大开发工具扩展程序。该扩展程序旨在帮助开发人员从Web浏览器中更有效，迅速地检查，解释和编辑代码。


＃＃ 特征
- 代码跟踪：只需指向鼠标，就可以在网页上跟踪任何React组件。该工具将突出显示源代码文件的确切位置，直到组件的特定行和列。
- 实时代码编辑：内置在开发工具面板中的编辑器允许进行即时代码更改。您可以直接在浏览器中应用代码更改，从而消除了对单独的文本编辑器或IDE的需求。

##谁会受益
React Code Finder非常有用：
- 使用React与Web开发合作的开发人员
- 想要快速找到代码部分的开发人员
- 希望实时编辑代码并查看Web浏览器中的更改的开发人员

＃＃ 安装
将React代码查找器添加到Chrome很简单。只需转到Chrome网络商店，然后单击“添加到Chrome”按钮。然后，扩展程序将准备好使用。

##如何使用
为了充分利用React代码查找器，您需要一个命令行接口（CLI）。这是步骤：

1。安装CLI：运行命令`npx react-code-finder-server`执行React Code Finder的必要CLI。 （如果要使用特定端口，请添加-P标志。例如`-p 8080`）
2。启动React Code Finder：运行CLI后，您可以通过Chrome浏览器启动React Code Finder。
3。开始导航和编辑：导航到您要检查的网页。现在，您可以使用Dev Tools面板编辑器开始跟踪并直接编辑React组件。

使用React Code Finder，我的目标是促进一个更顺畅，更有效的开发过程。立即使用React Code Finder体验更有生产力的开发环境！

##限制

不适用于React Server组件（RSC）。
该扩展基于状态节点（HTMlelement）和反应元之间的交叉引用。

https://github.com/vercel/next.js/discussions/64591

＃发行说明

2.2.7（2024.12.03）
- 添加React版本覆盖范围

2.2.4（2024.11.17）
- 修复了初始逻辑

2.2.3（2024.11.05）
- 修复了布局，网络错误消息
- 增强自动检测功能

2.2.0（2024.10.16）
- 新：添加的自动开/关功能：当您在DevTools中打开或关闭它时，现在将自动启用/禁用React-Code-Finder。
- 添加了打开IDE的功能，即使React-Finder-Server未运行。可以在选项页面上修改首选IDE（默认：VSCODE）

2.1.3
- 修复了布局，功能名称

2.1.0
- 修复了2个或更多反应根纤维冲突的错误
- 添加了一个查看器以查看当前源的道具