首页 web前端 js教程 浅谈Node 调试工具入门教程

浅谈Node 调试工具入门教程

May 25, 2018 pm 05:11 PM
node 入门教程 工具

这篇文章主要介绍了浅谈Node 调试工具入门教程,现在分享给大家,也给大家做个参考。

JavaScript 程序越来越复杂,调试工具的重要性日益凸显。客户端脚本有浏览器,Node 脚本怎么调试呢?

2016年,Node 决定将 Chrome 浏览器的"开发者工具"作为官方的调试工具,使得 Node 脚本也可以使用图形界面调试,这大大方便了开发者。

本文介绍如何使用 Node 脚本的调试工具。

一、示例程序

为了方便讲解,下面是一个示例脚本。首先,新建一个工作目录,并进入该目录。

$ mkdir debug-demo
$ cd debug-demo
登录后复制

然后,生成 package.json 文件,并安装Koa 框架和 koa-route 模块。

$ npm init -y
$ npm install --save koa koa-route
登录后复制

接着,新建一个脚本 app.js ,并写入下面的内容。

// app.js
const Koa = require('koa');
const router = require('koa-route');

const app = new Koa();

const main = ctx => {
 ctx.response.body = 'Hello World';
};

const welcome = (ctx, name) => {
 ctx.response.body = 'Hello ' + name;
};

app.use(router.get('/', main));
app.use(router.get('/:name', welcome));

app.listen(3000);
console.log('listening on port 3000');
登录后复制

上面代码是一个简单的 Web 应用,指定了两个路由,访问后会显示一行欢迎信息。如果想详细了解代码的详细含义,可以参考Koa 教程。

二、启动开发者工具

现在,运行上面的脚本。

$ node --inspect app.js
登录后复制

上面代码中, --inspect 参数是启动调试模式必需的。这时,打开浏览器访问 http://127.0.0.1//3000,就可以看到 Hello World 了。

接下来,就要开始调试了。一共有两种打开调试工具的方法,第一种是在 Chrome 浏览器的地址栏,键入 chrome://inspect 或者 about:inspect ,回车后就可以看到下面的界面。

在 Target 部分,点击 inspect 链接,就能进入调试工具了。

第二种进入调试工具的方法,是在 http://127.0.0.1//3000 的窗口打开"开发者工具",顶部左上角有一个 Node 的绿色标志,点击就可以进入。

三、调试工具窗口

调试工具其实就是"开发者工具"的定制版,省去了那些对服务器脚本没用的部分。

它主要有四个面板。

  1. Console:控制台

  2. Memory:内存

  3. Profiler:性能

  4. Sources:源码

这些面板的用法,基本上跟浏览器环境差不多,这里只介绍 Sources (源码)面板。

四、设置断点

进入 Sources 面板,找到正在运行的脚本 app.js

在第11行(也就是下面这一行)的行号上点一下,就设置了一个断点。

ctx.response.body = 'Hello ' + name;
登录后复制

这时,浏览器访问 http://127.0.0.1:3000/alice ,页面会显示正在等待服务器返回。切换到调试工具,可以看到 Node 主线程处于暂停(paused)阶段。

进入 Console 面板,输入 name,会返回 alice。这表明我们正处在断点处的上下文(context)。

再切回 Sources 面板,右侧可以看到 Watch、Call Stack、Scope、Breakpoints 等折叠项。打开 Scope 折叠项,可以看到 Local 作用域和 Global 作用域里面的所有变量。

Local 作用域里面,变量 name 的值是 alice ,双击进入编辑状态,把它改成 bob

然后,点击顶部工具栏的继续运行按钮。

页面上就可以看到 Hello bob 了。

命令行下,按下 ctrl + c,终止运行 app.js

五、调试非服务脚本

Web 服务脚本会一直在后台运行,但是大部分脚本只是处理某个任务,运行完就会终止。这时,你可能根本没有时间打开调试工具。等你打开了,脚本早就结束运行了。这时怎么调试呢?

$ node --inspect=9229 -e "setTimeout(function() { console.log('yes'); }, 30000)"
登录后复制

上面代码中, --inspect=9229 指定调试端口为 9229,这是调试工具默认的通信端口。 -e 参数指定一个字符串,作为代码运行。

访问 chrome://inspect ,就可以进入调试工具,调试这段代码了。

代码放在 setTimeout 里面,总是不太方便。那些运行时间较短的脚本,可能根本来不及打开调试工具。这时就要使用下面的方法。

$ node --inspect-brk=9229 app.js
登录后复制

上面代码中, --inspect-brk 指定在第一行就设置断点。也就是说,一开始运行,就是暂停的状态。

六、忘了写 --inspect 怎么办?

打开调试工具的前提是,启动 Node 脚本时就加上 --inspect 参数。如果忘了这个参数,还能不能调试呢?

回答是可以的。首先,正常启动脚本。

$ node app.js
登录后复制

然后,在另一个命令行窗口,查找上面脚本的进程号。

$ ps ax | grep app.js 

30464 pts/11  Sl+  0:00 node app.js
30541 pts/12  S+   0:00 grep app.js
登录后复制

上面命令中, app.js 的进程号是 30464

接着,运行下面的命令。

$ node -e 'process._debugProcess(30464)'
登录后复制

上面命令会建立进程 30464 与调试工具的连接,然后就可以打开调试工具了。

还有一种方法,就是向脚本进程发送 SIGUSR1 信号,也可以建立调试连接。

$ kill -SIGUSR1 30464
登录后复制

上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

Ajax实现智能提示搜索功能

Ajax请求成功后打开新窗口地址

通过Ajax方式上传文件使用FormData进行Ajax请求

以上是浅谈Node 调试工具入门教程的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1663
14
CakePHP 教程
1420
52
Laravel 教程
1313
25
PHP教程
1266
29
C# 教程
1239
24
数字货币app是啥软件?全球数字货币十大app盘点 数字货币app是啥软件?全球数字货币十大app盘点 Apr 30, 2025 pm 07:06 PM

随着数字货币的普及和发展,越来越多的人开始关注和使用数字货币app。这些应用程序为用户提供了便捷的管理和交易数字资产的方式。那么,数字货币app到底是什么软件呢?让我们深入了解,并盘点全球十大数字货币app。

php框架laravel和yii区别是什么 php框架laravel和yii区别是什么 Apr 30, 2025 pm 02:24 PM

Laravel和Yii的主要区别在于设计理念、功能特性和使用场景。1.Laravel注重开发的简洁和愉悦,提供丰富的功能如EloquentORM和Artisan工具,适合快速开发和初学者。2.Yii强调性能和效率,适用于高负载应用,提供高效的ActiveRecord和缓存系统,但学习曲线较陡。

怎样卸载MySQL并清理残留文件 怎样卸载MySQL并清理残留文件 Apr 29, 2025 pm 04:03 PM

要安全、彻底地卸载MySQL并清理所有残留文件,需遵循以下步骤:1.停止MySQL服务;2.卸载MySQL软件包;3.清理配置文件和数据目录;4.验证卸载是否彻底。

量化交易所排行榜2025 数字货币量化交易APP前十名推荐 量化交易所排行榜2025 数字货币量化交易APP前十名推荐 Apr 30, 2025 pm 07:24 PM

交易所内置量化工具包括:1. Binance(币安):提供Binance Futures量化模块,低手续费,支持AI辅助交易。2. OKX(欧易):支持多账户管理和智能订单路由,提供机构级风控。独立量化策略平台有:3. 3Commas:拖拽式策略生成器,适用于多平台对冲套利。4. Quadency:专业级算法策略库,支持自定义风险阈值。5. Pionex:内置16 预设策略,低交易手续费。垂直领域工具包括:6. Cryptohopper:云端量化平台,支持150 技术指标。7. Bitsgap:

给MySQL表添加和删除字段的操作步骤 给MySQL表添加和删除字段的操作步骤 Apr 29, 2025 pm 04:15 PM

在MySQL中,添加字段使用ALTERTABLEtable_nameADDCOLUMNnew_columnVARCHAR(255)AFTERexisting_column,删除字段使用ALTERTABLEtable_nameDROPCOLUMNcolumn_to_drop。添加字段时,需指定位置以优化查询性能和数据结构;删除字段前需确认操作不可逆;使用在线DDL、备份数据、测试环境和低负载时间段修改表结构是性能优化和最佳实践。

如何使用MySQL的函数进行数据处理和计算 如何使用MySQL的函数进行数据处理和计算 Apr 29, 2025 pm 04:21 PM

MySQL函数可用于数据处理和计算。1.基本用法包括字符串处理、日期计算和数学运算。2.高级用法涉及结合多个函数实现复杂操作。3.性能优化需避免在WHERE子句中使用函数,并使用GROUPBY和临时表。

Laravel 日志与错误监控:Sentry 和 Bugsnag 集成 Laravel 日志与错误监控:Sentry 和 Bugsnag 集成 Apr 30, 2025 pm 02:39 PM

在Laravel中集成Sentry和Bugsnag可以提高应用的稳定性和性能。1.在composer.json中添加SentrySDK。2.在config/app.php中添加Sentry服务提供者。3.在.env文件中配置SentryDSN。4.在App\Exceptions\Handler.php中添加Sentry错误报告。5.使用Sentry捕获并报告异常,并添加额外上下文信息。6.在App\Exceptions\Handler.php中添加Bugsnag错误报告。7.使用Bugsnag监

如何在MySQL中重命名数据库 如何在MySQL中重命名数据库 Apr 29, 2025 pm 04:00 PM

MySQL中重命名数据库需要通过间接方法实现。步骤如下:1.创建新数据库;2.使用mysqldump导出旧数据库;3.将数据导入新数据库;4.删除旧数据库。

See all articles