Element Dev

关闭面板 权限，不会在后台持续跟踪。 • 重新绑定。 • 开始元素选择 元素旁弹出悬浮面板，展示源文件与组件调用栈。 会用橙色虚线框高亮光标下的元素。 —— svelte ctrl+shift+e（macos：cmd+shift+e），或点击工具栏图标。 english activetab 的 css），便于调试或生成测试夹具。 18/19、next.js 通过读取框架开发模式的元数据（react 3（含 • vue 1. stack），清晰呈现深层元素的嵌套渲染链路。 react（含 悬停 🛡️ 仅在你主动触发时读取页面，且只读取你点击的那一个元素的相关信息。 5. 的可访问性快照。 开发服务器） 切换到「元素树」视图（element esc 核心功能 🧩 dev 复制元素完整信息（选择器、外层 • 点击元素，即可查看对应的源码文件、行号、列号以及渲染该元素的组件名。 • 完全开源，欢迎审阅与贡献。 • • dev • / 随时按 🌐 solid 为热爱在浏览器里调试的前端工程师而做。 单击 框架支持（开发模式） 在面板中自由切换「源码栈」与「元素树」两个视图。 隐私 element 退出选择 4. ⌨️ • 3. 2. nuxt） 使用方法 fiber、vue • 仅使用 查看完整的组件调用栈（source 把你的浏览器变成组件检查器。点击页面上的任意元素，它会立刻告诉你：是哪个文件、哪一行、哪个组件渲染了它 🎯 element preact • 关闭面板。 按下快捷键 / —— • esc 快捷键 • 简体中文 ✨ pr、群聊中分享。 chrome://extensions/shortcuts • • 一键复制文件路径，粘贴到编辑器的「跳转到文件」即可直达源码。 不收集、不存储、不上传任何用户数据。 —— cmd+shift+e 国际化 • ctrl+shift+e —— html、尺寸、计算后的 —— esc 按 • react 即可退出选择模式。 等）来追溯元素来源。生产构建中这些调试元数据会被移除，因此插件在生产环境不会生效。 • dev element dom tree），一键复制祖先结构、所选子树或整页 devtools，不必再靠猜。 不必再翻 一键复制元素截图到剪贴板，方便在 vnode __file • 可在