vscode调试npm包技巧

官网文档:https://code.visualstudio.com/docs/nodejs/nodejs-debugging

nodet调试方法(日志和debuuger):https://blog.risingstack.com/how-to-debug-nodej-js-with-the-best-tools-available/

https://segmentfault.com/a/1190000014664764

https://www.jianshu.com/p/8b034954abc9

(1)调试npm包非script执行,调试vue-cli配置如下

launch.json

{
    // 使用 IntelliSense 了解相关属性。
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node", //类型
            "request": "launch",  //有lanch和attach两种
            "name": "Launch via NPM",
            "runtimeExecutable": "node",
            "args": ["${workspaceRoot}\\node_modules\\@vue\\cli-service\\bin\\vue-cli-service.js"],  //通过npm-link后的指令地址从node_modules的bin里面去找(vue-cli-service serve)
            "restart": true,
            "protocol": "inspector",    //相当于--inspect了
            "sourceMaps": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen",
            "runtimeArgs": [    //对应nodemon --inspect之后除了启动文件之外的其他配置
                // "--exec",
                // "babel-node",
                // "--presets",
                // "env"
            ]
          },
    ]
}

request为launch时,就是launch模式了,这是程序是从vscode这里启动的,如果是在调试那将一直处于调试的模式。而attach模式,是连接已经启动的服务。比如你已经在外面将项目启动,突然需要调试,不需要关掉已经启动的项目再去vscode中重新启动,只要以attach的模式启动,vscode可以连接到已经启动的服务。当调试结束了,断开连接就好,明显比launch更方便一点。

(2)调试npm包script执行

"scripts": {
  "start": "NODE_ENV=production PORT=8080 babel-node ./bin/www",
  "dev": "nodemon --inspect --exec babel-node --presets env ./bin/www"
},
{
  "name": "Launch via NPM",
  "type": "node",
  "request": "launch",
  "runtimeExecutable": "npm",
  "runtimeArgs": [
    "run-script", "dev"    //这里的dev就对应package.json中的scripts中的dev
  ],
    "port": 9229    //这个端口是调试的端口,不是项目启动的端口
},

--inspect-brk=是node、nodemon打开调试,后面可加端口号--inspect-brk=5858

runtimeExecutable

runtimeArgs

port

(3)在debug中使用nodemon启动

{
  "type": "node",
  "request": "launch",
  "name": "nodemon",
  "runtimeExecutable": "nodemon",
  "args": ["${workspaceRoot}/bin/www"],
  "restart": true,
  "protocol": "inspector",    //相当于--inspect了
  "sourceMaps": true,
  "console": "integratedTerminal",
  "internalConsoleOptions": "neverOpen",
  "runtimeArgs": [    //对应nodemon --inspect之后除了启动文件之外的其他配置
    "--exec",
    "babel-node",
    "--presets",
    "env"
  ]
},

注意这里的runtimeArgs,如果这些配置是写在package.json中的话,相当于nodemon --inspect --exec babel-node --presets env ./bin/www

原文地址:https://www.cnblogs.com/little-ab/p/11796952.html

时间: 2024-11-08 17:22:30

vscode调试npm包技巧的相关文章

使用vscode调试小段的typescript代码

最近在学习typescript.学习 嘛,当然免不了各种练习,试错.那么使用vscode就可以很方便的做到. 首先是安装node.js.我们知道,node.js提供了js脱离浏览器的执行平台.node.js可以在官网下到,安装的时候下一步下一步就可以了. 使用node.js的npm包管理工具安装插件.打开cmd输入一下命令安装全局插件(全局插件好像电脑上任何文件夹都可以访问,不过局部安装可以用tsconfig文件灵活的控制使用插件版本): npm install -g ts-node npm i

VSCode调试go

VSCode调试go语言出现:exec: "gcc": executable file not found in %PATH% 1.问题描述 由于安装VS15 Preview 5,搞的系统由重新安装一次:在用vscdoe编译go语言时,出现以下问题: # odbcexec: "gcc": executable file not found in %PATH%exit status 2 2.解决方案 2.1 mingw 64 MinGW分为较早开发的MinGW32和之

vscode 调试node.js

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

npm包的更新说明,你还敢不看吗

npm包的更新说明,你还敢不看吗 前言 平时工作少不了依赖一些第三方的npm包,站在各位大牛的肩膀上来更好的写bug,此外还可以学习各位大佬们的各种设计思路和优雅实现.不过npm包虽好,但使用之前也要多加甄别,特别是相同包的不同版本之间的差别,可能一不小心,原本用的飞起的轮子就会让我们笑不出来.下面用两次惨痛的线上问题来给大家提个醒. 版本依赖符号 在描述问题之前,先谈一下npm的包管理控制. 假设我们依赖一个npm包 a 常见的依赖符号有下面这么几种 { "dependencies"

vscode调试html文件

1. vscode调试html文件 1.1. 使用Debugger for Chrome进行调试 1.1.1. 基于本地file配置方式调试 1.1.2. 基于服务端配置方式调试 1.1.2.1. 启动server端 1.1.2.2. 配置vscode 1.2. 使用Nodejs配置调试 1.3. 参考 1. vscode调试html文件 主要说明使用使用Debugger for Chrome插件如何配置,以及Nodejs的方式调试. 本文的配置方式是基于deepin系统的,适用于所有debia

Node.js权威指南 (4) - 模块与npm包管理工具

4.1 核心模块与文件模块 / 574.2 从模块外部访问模块内的成员 / 58 4.2.1 使用exports对象 / 58 4.2.2 将模块定义为类 / 58 4.2.3 为模块类定义类变量或类函数 / 614.3 组织与管理模块 / 61 4.3.1 从node_modules目录中加载模块 / 61 4.3.2 使用目录来管理模块 / 62 4.3.3 从全局目录中加载模块 / 624.4 模块对象的属性 / 634.5 包与npm包管理工具 / 65 4.5.1 Node.js中的包

怎么开发一个npm包

一.注册npm账号* 怎么将代码提到github,大家都知道需要一个github账号* 同样,开发一个npm包,当然也需要一个npm账号,将npm包发布到npm的托管服务器* 注册地址:[http://npmjs.org](http://npmjs.org)* 该实例包含了模块的局部调用和全局调用两种方式 二.开发npm包 1.目录构建* npm init* 项目结构:```javascript.├── bin //命令配置├── README.md //说明文档├── index.js //主

使用cnpm搭建私有NPM仓库 发布npm包

关于如何使用cnpm搭建私有的npm仓库看这里→ http://blog.fens.me/nodejs-cnpm-npm/ 我本人还没有机会真正实践操作过,公司的npm仓库是我老大搭建的,我这里仅仅记录关于如何发布npm包以及在这过程中出现的问题以及解决的方案. 因为官方的npm上的模块是完全开源,但是公司自己项目有些模块与业务或者逻辑以及一些配置模块肯定不能开源啊,所以需要搭建私有的npm仓库. 1.准备工作 首先安装好npm 以及 cnpm . 现在安装node.js 里会一起安装好npm.

Lodash,npm包仓库中依赖最多的库

简介 lodash,是具有一致接口.模块化.高性能等特性的 JavaScript 工具库.提供了大量的工具函数,也正是因为这个原因,使得lodash成为了npm包库中被其它库依赖最多的库. 就像jQuery在全部函数前加全局的$一样,lodash使用全局的_来提供对工具的快速访问. var _ = require('lodash'); 提高开发者效率 //copy一个JS对象 //原生方法 var a = {a:1,b:2,c:3}; var b = {}; for(var key in a)