deno

2.7 Deno调试代码

2021-04-29  本文已影响0人  9e8aeff1c70c

Deno支持V8检查器协议

可以使用Chrome Devtools或其他支持该协议的客户端(例如VSCode)来调试Deno程序。

要激活调试功能,请使用--inspect--inspect-brk标志运行Deno 。

--inspect标志允许在任何时间点附加调试器,同时 --inspect-brk将等待调试器附加并暂停第一行代码的执行。

Chrome Devtools

让我们尝试使用Chrome Devtools调试程序。为此,我们将使用 来自 静态文件服务器的file_server.tsstd

使用该--inspect-brk标志在第一行中断执行:

$ deno run --inspect-brk --allow-read --allow-net https://deno.land/std@0.95.0/http/file_server.ts
Debugger listening on ws://127.0.0.1:9229/ws/1e82c406-85a9-44ab-86b6-7341583480b1
Download https://deno.land/std@0.95.0/http/file_server.ts
Compile https://deno.land/std@0.95.0/http/file_server.ts
...

打开chrome://inspect并单击Inspect目标旁边:

image.png

打开Devtools可能需要几秒钟来加载所有模块。

image.png

您可能会注意到Devtools在_constants.ts代替的第一行暂停了执行 file_server.ts。这是预期的行为,并且是由V8评估ES模块的方式引起的(_constants.ts是V8的最左,最底层依赖项,file_server.ts因此首先对其进行评估)。

此时,所有源代码都可以在Devtools中找到,因此让我们打开 file_server.ts并在其中添加一个断点。转到“源”窗格并展开树:

image.png

仔细观察,您会发现每个文件都有重复的条目;一份定期写成,另一份以斜体写。前者是编译后的源文件(因此,在.ts文件的情况下,它将发出JavaScript源),而后者是该文件的源映射。

接下来,在listenAndServe方法中添加一个断点:

image.png

添加断点后,Devtools会自动打开源映射文件,这使我们可以逐步浏览包含类型的实际源代码。

现在我们已经设置了断点,我们可以继续执行脚本,以便我们可以检查传入的请求。点击恢复脚本执行按钮。您甚至可能需要打两次!

脚本再次运行后,让我们发送一个请求并在Devtools中对其进行检查:

$ curl http://0.0.0.0:4507/
image.png

在这一点上,我们可以内省请求的内容,并逐步调试代码。

VSCode

可以使用VSCode调试Deno。

正在通过插件提供官方支持-https: //github.com/denoland/vscode_deno/issues/12

我们仍然可以通过手动提供launch.json 配置来附加调试器 :

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Deno",
      "type": "pwa-node",
      "request": "launch",
      "cwd": "${workspaceFolder}",
      "runtimeExecutable": "deno",
      "runtimeArgs": ["run", "--inspect-brk", "-A", "${file}"],
      "attachSimplePort": 9229
    }
  ]
}

注意:这将使用您打开的文件作为入口点;${file} 如果需要固定的入口点,请用脚本名称替换。

让我们尝试调试本地源文件。创建server.ts

import { serve } from "https://deno.land/std@0.95.0/http/server.ts";
const server = serve({ port: 8000 });
console.log("http://localhost:8000/");
for await (const req of server) {  
   req.respond({ body: "Hello World\n" });
}

然后我们可以设置一个断点,并运行创建的配置:

image.png

JetBrains IDE

您可以使用JetBrains IDE调试Deno,方法是右键单击要调试的文件并选择Debug 'Deno: <file name>'选项。这将创建一个没有设置权限标志的运行/调试配置。要配置这些标志,请编辑运行/调试配置,并Arguments使用必需的标志修改该字段。

其他

任何实现Devtools协议的客户端都应该能够连接到Deno进程。

局限性

Devtools支持仍不成熟。有一些已知的功能缺失或错误:

上一篇 下一篇

猜你喜欢

热点阅读