在 Chrome 浏览器中设置 AdonisJs 开发工具

AdonisJs 是一个基于 Node.js 平台的 MVC 框架，因其简单易用、功能强大而备受欢迎。但开发一个复杂的应用程序时，会面临许多问题和挑战。为帮助程序员解决这些问题，Chrome 浏览器提供了一些非常好用的开发工具。

在本文中，我们将介绍如何在 Chrome 浏览器中设置 AdonisJs 开发工具，并展示一些常用功能。让我们开始吧！

环境准备

在开始设置 Chrome 开发工具之前，你需要完成以下准备工作：

• 安装 Chrome 浏览器：从 Chrome 官网 下载并安装最新版 Chrome 浏览器。
• 安装 AdonisJs：在命令行中输入以下命令，安装最新版的 AdonisJs：

npm i -g @adonisjs/cli

设置 Chrome 开发工具

1. 打开 Chrome 浏览器并进入一个 AdonisJs 应用程序。
2. 在 Chrome 浏览器中打开开发者工具：按下 Ctrl + Shift + J（Windows、Linux）或 Cmd + Opt + J（Mac OS）。
3. 进入 AdonisJs 开发工具：在开发者工具中点击左侧导航栏中的 “AdonisJS” 选项。

现在，你已经成功地设置了 Chrome 开发工具，并可以开始利用其强大的功能来提高 AdonisJs 应用程序的开发效率。

常用功能

调试路由

调试路由是一个非常基本的操作，但对开发 AdonisJs 应用程序来说是必不可少的。在 Chrome 开发工具中，你可以轻松地查看当前应用程序的所有路由。

在左侧导航栏中选择 “Routes”，即可查看所有路由的列表。选中某个路由，可以查看该路由的详细信息、参数、中间件等。

调试查询

AdonisJs 应用程序通常涉及与数据库的交互。在 Chrome 开发工具中，你可以轻松地查看应用程序发出的所有查询语句，以及相应的响应时间。

在左侧导航栏中选择 “SQL”，即可查看所有查询的列表。选中某个查询，可以查看该查询的详细信息以及响应时间。

调试响应

在开发过程中，查看每个请求的响应内容是非常有用的。在 Chrome 开发工具中，你可以轻松地查看每个请求的响应，并以可视化的方式查看 JSON 响应。

在左侧导航栏中选择 “Response”，即可查看所有请求的响应。选中某个响应，可以查看该响应的详细信息以及响应 JSON 内容的树形表示。

结论

在本文中，我们介绍了如何使用 Chrome 开发工具来调试 AdonisJs 应用程序。虽然我们只展示了一些常用功能，但 Chrome 开发工具还有很多其他有用的功能可以帮助你更轻松地开发应用程序。祝你使用愉快！