2.7 Deno调试代码

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支持仍不成熟。有一些已知的功能缺失或错误:

  • Devtools控制台中的autocomplete会导致Deno进程退出。
  • 分析和内存转储可能无法正常工作。
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 默认情况下,Deno是安全的。因此,除非您专门启用它,否则deno模块不能访问文件,网络或环境。要访问安全敏感的区...
    9e8aeff1c70c阅读 499评论 0 1
  • 随着掘金开启了第一期技术专题之“聊聊 Deno 的一些事儿”的征稿活动,赶在截稿日的最后一天(08/04),一篇新...
    hylerrix阅读 645评论 0 0
  • 要高效地使用Deno,您应该设置您的环境。这意味着设置shell自动完成,环境变量以及您选择的编辑器或IDE。 [...
    9e8aeff1c70c阅读 905评论 0 1
  • 第一步 此页面包含一些示例,以教您有关Deno的基础知识。 本文档假定您具有JavaScript的某些先决知识,尤...
    9e8aeff1c70c阅读 254评论 0 1
  • 命令行界面 Deno是一个命令行程序。到目前为止,您应该已经熟悉了一些简单的命令,并且已经了解了Shell使用的基...
    9e8aeff1c70c阅读 641评论 0 1