调试工具_7个必备的前端调试工具

你好，欢迎收听极客视点。

应用程序漏洞一直是前端调试人员的痛苦根源。如果你从事前端工作的话，就会知道修复应用程序漏洞有多么困难。特别是使用 JavaScript 时，一个很小的错误有时都有可能需要用几个小时来调试。然而，对于不同的浏览器、操作系统和设备而言，存在漏洞是不可避免的事情。

近日，科技作者马赫迪·雷兹维（Mahdhi Rezvi）分享了 7 个前端调试工具，公众号“读芯术（ID：AI_Discovery）”对其进行了编译，希望对你有所帮助。

1. 网页浏览器的开发人员工具

任何现代的网页浏览器都配备了强大的工具来帮助你调试应用程序。这些工具在调试任务中非常有用，特别是调试器语句。

2. CSS Lint

CSS Lint 不仅可以用来验证代码，还可以用来选择要检测的错误和警告。它执行基本的语法检查，并将一个规则组应用于代码，查找存在问题的模式或低效迹象的代码。

3. JSON 格式化和校验工具

在无格式 JSON 中，我们很难发现语法错误或键值不正确的情况，因为它很难阅读。当 JSON 文件缺少行返回和空格时，在压缩的 JSON 文件中读取和发现错误则更有挑战性。

你可以使用 JSON 格式化和校验工具，简单地插入经过压缩的 JSON 并获得正确格式的版本作为输出。此外，该工具还可以根据 RFC 标准来验证 JSON。

4. Postman

Postman 是最好的 JavaScript 工具之一，它可以用于调试请求和响应。此外，它也为 macOS 系统、Windows 系统和 Linux 系统提供软件，并能快速、简单地直接发送 REST、SOAP 和 GraphQL 请求。

使用 Postman 可以调整请求、分析响应和修复漏洞问题，当不确定问题出在前端还是后端时，可以尝试采用它。

5. Sentry

Sentry 基于云的错误日志系统可以帮助你记录错误实例，即使在发布之后也是如此。此外，Sentry 还提供了涵盖大多数可用框架的全面解决方案。

6. BrowserStack

它可以帮你模拟用户遇到错误时的准确环境。当你记录错误时，可以通过引用环境并在 BrowserStack 中重新创建它来重现准确的场景。

7. JSHint

这是一个检测 JavaScript 代码中的错误和潜在问题的静态代码分析工具，可以帮你发现很难发现的问题。

JSHint 扫描用 JavaScript 编写的程序，报告常见的错误和潜在的漏洞，可能是语法错误、隐式类型转换导致的漏洞、泄漏变量或其他一些问题。

以上就是今天的内容，希望对你有所帮助。

原文链接：7 Must-Use Front-End Debugging Tools