用于调试 Alpine.js 应用程序的 DevTools 扩展。
使用适当的工具调试 Alpine.js 应用程序
Alpine.js DevTools Pro 为您的 Chrome DevTools 添加了一个干净、专业的面板，使调试 Alpine.js 应用程序变得非常愉快。
你得到什么
查看 Alpine.js 应用程序中发生的一切
• 以漂亮的树结构查看所有组件
• 实时检查组件数据、方法和属性
• 直接编辑值并观看页面立即更新
• 将鼠标悬停在组件上以在页面上突出显示它们
再也不会错过任何活动
• 记录所有发生的 Alpine.js 事件
• 准确查看每个事件携带哪些数据
• 当您需要集中注意力时暂停录制
• 当事情变得混乱时清除历史记录
像专业人士一样管理您的 Alpine 商店
• 所有 Alpine.store() 实例都集中在一处
• 即时编辑存储值
• 适用于简单值和复杂对象
• 观看整个应用程序的所有更新
为什么存在这个扩展
调试 Alpine.js 应用程序过去意味着到处都有 console.log 并猜测组件数据中的内容。此扩展使您可以完全了解 Alpine.js 应用程序，而无需猜测。
您可以期待什么
它只是有效
• 自动检测任何页面上的 Alpine.js
• 需要零设置
• 顺利处理大型应用程序
• 专为性能和稳定性而打造
专业品质
• 正确处理复杂的数据结构
• 值得信赖的稳定性能
• 定期更新和真正的支持
• 专为实际生产项目而设计
干净的界面
• 浅色和深色主题（遵循您的系统偏好）
• 您期望找到的一切
• 没有混乱的用户界面或令人困惑的按钮
• 专注于完成工作
非常适合
- Laravel 开发人员在他们的项目中使用 Alpine.js
- 需要调试组件交互的 Livewire 团队
- 使用 Hyvä Theme 和 Hyvä Commerce 的 Magento 开发人员
- 建立定制 Hyvä 店面和 Hyvä 结账流程的机构
- 前端开发人员调试 Alpine.js 应用程序
- 任何使用 Alpine.js 构建现代 Web 应用程序并需要适当调试工具的人
主要特性一览
✓ 组件检查器 - 查看所有 Alpine 组件及其数据
✓ 实时编辑 - 更改值并查看即时结果
✓ 事件监控 - 捕获每个事件的完整详细信息
✓ 商店管理 - 轻松调试 Alpine 商店
✓ 元素关联 - 单击以在 DOM 中检查
✓ 实时更新 - 一切自动同步
✓ Livewire 支持 - 与服务器端事件完全集成
✓ 性能优化 - 不会减慢您的开发速度
✓ 深色/浅色主题 - 无论您喜欢什么
✓ 专业许可 - 用于商业用途
它如何帮助您的工作流程
• 查看清晰组织的所有组件数据
• 实时观看事件发生
• 直接在DevTools 中编辑值
• 不再有控制台垃圾邮件
常见的调试任务变得简单：
• “为什么这个组件没有更新？” → 实时查看元件数据
• “此事件触发了吗？” → 观看事件监视器
• “我的 Alpine 商店里有什么？” → 查看所有商店及其内容
• “这个元素是哪个组件？” → 悬停并突出显示
免费试用，价格公道
安装它并在您的项目中试用。没有人为的限制或烦人的试用弹出窗口。
对于商业用途，您需要许可证。它价格合理，最多可在 3 台设备上运行。您可以从帐户仪表板管理一切。
支持和更新
• 定期更新新功能和错误修复
• 当您需要帮助时提供响应支持
• 由每天实际使用 Alpine.js 的人构建
• 根据用户反馈不断改进
