Javascript 调试节点时VSCode未正确解析内联源映射

Javascript 调试节点时VSCode未正确解析内联源映射,javascript,node.js,visual-studio-code,babeljs,source-maps,Javascript,Node.js,Visual Studio Code,Babeljs,Source Maps,我正在尝试调试一个多根项目结构(包含多个项目的根文件夹)中的应用程序,但在让vscode的调试器识别babel生成的源映射时遇到了问题 我的launch.json中有这个 { “配置”:[ { “控制台”:“集成终端”, “internalConsoleOptions”:“neverOpen”, “名称”:“nodemon”, “程序”:“${workspaceFolder}/project/index.js”, “请求”:“启动”, “cwd”:“${workspaceFolder}/proj

我正在尝试调试一个多根项目结构(包含多个项目的根文件夹)中的应用程序,但在让vscode的调试器识别babel生成的源映射时遇到了问题

我的
launch.json中有这个

{
“配置”:[
{
“控制台”:“集成终端”,
“internalConsoleOptions”:“neverOpen”,
“名称”:“nodemon”,
“程序”:“${workspaceFolder}/project/index.js”,
“请求”:“启动”,
“cwd”:“${workspaceFolder}/project”,
“重启”:正确,
“源地图”:正确,
“runtimeExecutable”:“nodemon”,
“runtimeArgs”:[“--inspect”、“--exec”、“${workspaceFolder}/node_modules/.bin/babel node--config file./.babelrc.js”、],
“滑雪板”:[
"/**",
],
“类型”:“pwa节点”
}
]
}
.lrc.js

module.exports={
“源地图”:“两者”,
“预设”:[
[“@babel/env”{
“目标”:{
“节点”:“当前”
}
}]
],
“插件”:[
“@babel/插件建议类属性”,
“源地图支持”
],
}
和我的
index.js
文件

require('source-map-support/register'))
需要(“@babel/register”);
要求(“@babel/polyfill”);
要求('./app.js');
当我添加一个断点时,它会将其添加到另一个位置,当我单击断点本身时,它会打开已编译的文件,我看到断点位于错误的位置。我还看到sourcemaps已经内联,但是vscode似乎没有正确地解析它们,或者根本没有解析它们

我试着在他们的名字中使用sourcemap这个词,但没有一个能起作用

如果我在Webstorm中以相同的方式打开项目并附加到正在运行的进程,它将正确解析sourcemaps并在必要时停止,但由于某种原因,vscode无法这样做


我试图在vscode中只打开这一个项目,并将.vscode文件夹移动到
项目
文件夹中,但它没有产生任何结果,因此我认为这无关紧要,我决定提及它,如果它有助于解决问题。

我最终编辑了调试配置,并以某种方式使其正常工作

以下是配置

项目结构如下

/root
   /project
/.babelrc
{
“环境”:{
“发展”:{
“插件”:[“源地图支持”]
}
},
“预设”:[
[“@babel/env”{
“目标”:{
“节点”:“当前”
}
}]
]
}
调试配置

{
“名称”:“调试”,
“港口”:9229,
“请求”:“附上”,
“重启”:正确,
“cwd”:“${workspaceFolder}/project”,
“滑雪板”:[
"/**",
“${workspaceFolder}/project”
],
“类型”:“节点”
}
入口点看起来是这样的

//index.js
if(process.env.NODE_env===‘development’){
需要('source-map-support/register')
}
需要(“@babel/register”);
要求(“@babel/polyfill”);
require('main.js');
为了允许调试器连接到此端口(默认端口为9229),您需要使用
--inspect
标志启动服务器

我使用
nodemon
让它工作,这就是我使用的脚本

nodemon--inspect=127.0.0.1:9229 index.js

您可以只使用
--inspect
,因为
127.0.0.1:9229
是默认的主机:端口。但是,如果您的计算机上运行多个服务器,则会发生端口冲突,因此您希望在不同的端口上运行它们

如果同时运行客户端和服务器应用程序,则需要使用不同的端口。不要忘记在
launch.json
文件中相应地设置端口

nodemon --inspect=127.0.0.1:9229 index.js
nodemon --inspect=127.0.0.1:9230 index.js
现在,我不确定
源代码映射支持/注册部分是否有必要(尽管我几乎没有让它工作,也不想弄乱它)

当使用
babel/register
时,它会在运行时传输代码,因此源代码应该保持完整,这就是不需要源映射的原因

我使用的是
attach
模式,因为我从外部终端运行应用程序。如果要运行启动配置,请查看

免责声明

按照我的理解,在没有
outDir
的情况下进行这种调试相当慢。如果你正在做一个较小的项目,它可能不会打扰你,对我来说,保存之后,应用程序重新开始运行之前的时间大约是10秒

我不知道如何通过这种设置来解决这个问题,如果你正在构建你的项目,它应该会更快。使用
启动
配置可能会更快