@linhey/react-debug-inspector 1.2.0 → 1.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -1
- package/dist/index.js +427 -156
- package/dist/index.mjs +427 -156
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -20,7 +20,8 @@
|
|
|
20
20
|
|
|
21
21
|
1. 点击右下角的 🎯 按钮进入检查模式
|
|
22
22
|
2. 鼠标悬停在任何元素上查看调试信息
|
|
23
|
-
3.
|
|
23
|
+
3. 直接点击元素复制完整的调试标识
|
|
24
|
+
4. 使用悬浮菜单复制文案、图片或全部上下文
|
|
24
25
|
4. 按 `Esc` 键退出检查模式
|
|
25
26
|
|
|
26
27
|
<!-- TODO: 添加演示 GIF -->
|
|
@@ -32,6 +33,7 @@
|
|
|
32
33
|
|
|
33
34
|
- 🚀 **零配置注入**：通过 Babel 插件自动为每个 JSX 元素添加 `data-debug` 属性。
|
|
34
35
|
- 🎯 **瞄准模式**：悬浮显示元素标识，单击一键复制。
|
|
36
|
+
- 🧾 **上下文复制**：支持复制目标文案、图片信息和完整调试上下文。
|
|
35
37
|
- 📁 **完整路径**：显示文件路径、组件名、标签名和行号，精确定位源码。
|
|
36
38
|
- 🌳 **零污染**：生产环境构建时自动剔除，不增加包体积。
|
|
37
39
|
- ⌨️ **快捷键支持**：支持 Esc 退出及 Alt+右键 快速复制。
|
|
@@ -77,7 +79,9 @@ if (import.meta.env.DEV) {
|
|
|
77
79
|
|
|
78
80
|
- **🎯 按钮**：位于右下角，点击进入/退出审查模式。
|
|
79
81
|
- **悬浮模式**：进入模式后，鼠标指向的元素将被高亮，并显示 `文件名 › 组件 › 标签:行号`。
|
|
82
|
+
- **悬浮菜单**：命中元素后可使用“复制 ID / 复制文案 / 复制图片 / 全部复制”。
|
|
80
83
|
- **单击左键**：复制完整标识（`文件路径:组件:标签:行号`）到剪贴板并退出。
|
|
84
|
+
- **复制图片**：优先尝试写入图片本体；若浏览器或资源不支持，则自动降级复制图片信息文本。
|
|
81
85
|
- **Esc**：退出模式。
|
|
82
86
|
- **Alt + 右键**：非模式下亦可直接复制标识。
|
|
83
87
|
|