vscode 调试 node.js的方法步骤

引言

作为前端工程师经常打交道的开发工具无非 IDE 编辑器 和 Chrome,在 Chrome 中调试是非常方便的,直接在 开发者工具的 source 栏打断点就可以了。那么,如果遇到需要写 node 相关的代码,比如 webpack 配置项,应该怎么调试来实现我们的需求呢?

VS Code 配置

在 VS Code 中单独有 debug 的菜单,需要指定 launch.json 文件,该文件为 VS Code 提供启动调试所需的各项配置。

// launch.json
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387

{
 "version": "0.2.0",
 "configurations": [
  {
   "type": "node",
   "request": "launch",
   "name": "Launch via NPM",
   "runtimeExecutable": "npm",
   "runtimeArgs": ["run-script", "debug"],
   "cwd": "${workspaceFolder}/envloader/mobile",
   "port": 9229
  }
 ]
}

上面是我们项目的调试配置, runtimeExecutable 指明调试方式是 npm 方式, runtimeArgs 为执行调试传的参数, cwd 指定工作目录。

// package.json

"scripts": {
  "debug": "node --max_old_space_size=12288 --inspect-brk node_modules/webpack/bin/webpack.js --config build/webpack.dev.js --watch"
 },

注意 debug 脚本要传入 --inspect-brk ,这样才可以开启 node 的调试功能。

VS Code 调试菜单点击执行按钮,我们就可以愉快的调试 webpack.dev.js 代码了。

可以看到,webpack 内部的数据结构尽收眼底。

Chrome 开发者工具风格

刚才的 launch.json 中,有 port: 9229 这个属性,我们可以在浏览器访问 chrome://inspect ,就能以我们熟悉的 chrome 风格来调试 node 程序了。

总结

调试程序能够帮助我们对代码有更深刻的了解,能够提供运行时的执行上下文、调用栈等信息。此外,在调试线上混淆后的代码时,对各种 a、o、f 等难以理解的变量名参数名也能通过运行时的变量数据轻易分析出代码的基本逻辑。

到此这篇关于vscode 调试 node.js的方法步骤的文章就介绍到这了,更多相关vscode 调试 node.js内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • 详解如何在vscode里面调试js和node.js的方法步骤

    在开发的过程中,几乎不可能一次性就能写出毫无破绽的程序,断点调试代码是一个普遍的需求. 作为前端开发工程师,以往我们开发的JavaScript程序都运行在浏览器端,利用Chrome提供的开发者工具就可以方便的进行源码断点调试.其步骤有四,详情不表,粗略概括如下: 1.打开Chrome开发者工具: 2.点击进入Sources标签页,在页面的左侧就能看到JS代码的目录: 3.找到需要设置断点的源文件,在需要中断的哪行代码左侧单击鼠标左键,就可以设置断点,如果你的代码是uglify过的,则需导入相应的

  • vscode调试node.js的实现方法

    在开发的过程中,几乎不可能一次性就能写出毫无破绽的程序,断点调试代码是一个普遍的需求. 作为前端开发工程师,以往我们开发的JavaScript程序都运行在浏览器端,利用Chrome提供的开发者工具就可以方便的进行源码断点调试.其步骤有四,详情不表,粗略概括如下: 打开Chrome开发者工具:点击进入Sources标签页,在页面的左侧就能看到JS代码的目录:找到需要设置断点的源文件,在需要中断的哪行代码左侧单击鼠标左键,就可以设置断点,如果你的代码是uglify过的,则需导入相应的source-m

  • vscode 调试 node.js的方法步骤

    引言 作为前端工程师经常打交道的开发工具无非 IDE 编辑器 和 Chrome,在 Chrome 中调试是非常方便的,直接在 开发者工具的 source 栏打断点就可以了.那么,如果遇到需要写 node 相关的代码,比如 webpack 配置项,应该怎么调试来实现我们的需求呢? VS Code 配置 在 VS Code 中单独有 debug 的菜单,需要指定 launch.json 文件,该文件为 VS Code 提供启动调试所需的各项配置. // launch.json // 使用 Intel

  • VSCODE调试RDKit内核的方法步骤(C++)

    目录 安装 RDKit 所需环境 配置 VSCode 使其能 Debug 配置 Intellisense 配置 CMake 新建调试文件进行调试 Anaconda 环境问题 参考资料 在研究 RDKit 的一些算法的时候,总希望能够"进入到代码中"看这些变量到底是什么,哪些代码块会被执行.可 RDKit 的编译比较复杂,如果是 Python 的部分,那么可以直接在 VSCode 中进行调试,记得在 launch 中设置 "justMyCode: false",详见该

  • Docker部署Node.js的方法步骤

    前言 项目中会用到node做中间层,部署node则是用到了docker,在这里总结.记录下部署要点和步骤:关于docker的介绍和安装这里就不赘述了,网上也有很多相关的教程和文章了,需要可自行搜索查看. 项目结构 `-- docker-node |-- data |-- server |-- app.js |-- Dockerfile |-- process.yml |-- package.json |-- docker-compose.yml 1.创建Node.js程序 app.js cons

  • VSCode配置C++环境的方法步骤(MSVC)

     最近心血来潮,想用一下微软的VSCode写一下C++,然而第一步就卡住了,竟然不会配置C++环境,陆陆续续搞了两天,总算是弄明白了,网上msvc教程比较少,就打算分享出来,也记录下自己的历程.  先说说我的理解吧,Visual Studio Code和visual studio不同,后者是属于IDE是个集成开发环境,下载好基本就能直接用来写C++等:  而Visual Studio Code(以下简称VSC)是一个编辑器,简单来说和windows电脑上的那个看.txt文件的记事本一个类别,然而

  • 用Nginx反向代理Node.js的方法

    本文介绍了用Nginx反向代理Node.js的方法,分享给大家,具体如下: 安装pm2 npm install pm2 -g ln -s /home/download/node-v8.11.1-linux-x64/lib/node_modules/pm2/bin/pm2 /usr/local/bin/pm2 修改package.json "scripts": { "test": "echo \"Error: no test specified\&

  • VsCode与Node.js知识点详解

    1.下载及安装node.js 下载:http://nodejs.cn/download/ 安装:指定安装目录,安装即可.环境变量会自动配置 验证: 2.下载及安装VsCode 指定安装目录: 注意 : 环境变量也是自动添加,但是需要重启生效 1.启动后端代码 2.启动VsCode,在File---->打开文件夹---->选择前端代码文件夹----->打开 3.target 4.右键--->命令行--->npm run dev 5.启动成功后,ctrl+url即可访问页面 上面

  • vscode调试django项目的方法

    这几天研究HUE,这个东西是基于Django开发的,于是又看了一眼Django,学着写个demo.微软开源的vscode在业界反应不错,以前也没用过,借着这次机会用用vscode,和pycharm比起来各有千秋,不过总体来说还是不错的.新工具各种不熟悉,连怎么调试都得研究研究,现在记录一下vscode 怎么弄Django项目的调试. 下载Django模块 进入vscode 先下载django,点击左侧最下面图标,搜索Django,点击下图2的位置的install 添加Django模块到vscod

  • Docker搭建部署Node项目的方法步骤

    目录 什么是Docker 客户端Docker Docker基本操作 镜像名称 拉取镜像 其他操作 Dockerfile Docker-compose 构建nginx-node-postgres项目 前段时间做了个node全栈项目,服务端技术栈是 nginx + koa + postgresql.其中在centos上搭建环境和部署都挺费周折,部署测试服务器,接着上线的时候又部署生产环境服务器.这中间就有很多既无聊又费精力,吃力不讨好的"体力活".所以就开始思考怎么自动化这部分搭建部署的工

随机推荐