如何使用VSCode中的npm运行脚本进行调试？

Question

我以前使用gulp并运行gulp从Visual Studio Code debugger启动我的应用程序和监听器，但最近需要通过npm切换到运行脚本。不幸的是在VSCode中，我无法通过调试器运行npm脚本，所以我不得不求助于运行节点直接启动我的服务器，这摆脱了我自动重新加载代码的监听器任务。

这看起来应该很简单，但到目前为止，我没有太多运气。下面是我尝试使用的launch.json文件的片段，但无法找到npm。

{
    ...
        "program": "npm",
        "args": [
            "run",
            "debug"
        ],
    ...
}

这给了我以下错误。

错误请求'launch'：程序'c：\ myproject \ npm'不存在

相关资源：

• https://github.com/Microsoft/vscode/issues/2726

Answer 1

似乎VS Code将支持release from October 2016中的npm脚本和其他启动方案。

下面是一个例子，因为它是proposed on GitHub。

packages.json

  "scripts": {
    "debug": "node --nolazy --debug-brk=5858 myProgram.js"
  },

vscode启动配置

{
    "name": "Launch via NPM",
    "type": "node",
    "request": "launch",
    "cwd": "${workspaceRoot}",
    "runtimeExecutable": "npm",
    "runtimeArgs": [
        "run-script", "debug"
    ],
    "port": 5858
}

Answer 2

1. 在.vscode / launch.json中配置新的调试目标：

   {
       "name": "Attach To npm",
       "type": "node",
       "request": "attach",
       "port": 5858,
       "address": "localhost",
       "restart": false,
       "sourceMaps": false,
       "outDir": null,
       "localRoot": "${workspaceRoot}",
       "remoteRoot": null
   }

2. 使用--debug-brk选项配置您的npm以运行节点：

   "scripts": {
     "start": "node app.js",
     "debug": "node --debug-brk app.js"
     ...

3. 从shell启动您的应用程序： $npm run debug
4. 默认情况下，程序将在端口5858中等待连接调试器
5. 因此，在visual studio代码中运行调试器（“Attach To npm”）。
6. 享受你的调试器:)

Answer 3

使用npm是可行的，无需改变你在qazxsw poi中的qazxsw poi部分

这里的技巧是将scripts传递给节点。

该命令看起来像package.json

这是--inspect-brk=9229：

npm run start -- --inspect-brk=9229

Answer 4

我尝试了GutiMac和Jpierson提供的解决方案，但由于某些原因，我无法使调试器与其中任何一个一起工作。

另一个对我来说很好的解决方案（Ubuntu 16，节点8.9.1，VS 1.8.1）是使用这个简单的应用程序启动器（将在VS launch.json的配置数组中添加）：

.vscode/launch.json

Answer 5

NPM脚本和gulp并不是真正用于启动应用程序，而是用于运行编译等任务。如果它是节点应用程序，我建议您在没有npm的情况下以这种方式配置launch.json。如果您有复杂的侦听器或PM2等流程管理器，请从流程管理器手动启动应用程序，然后使用Attach配置。

对于npm任务，您可以使用

{  
"version": "0.2.0",
"configurations": [
    {
        "type": "node",
        "request": "launch",
        "name": "Launch via NPM",
        "runtimeExecutable": "${env:NVM_BIN}/npm", //change this to your npm path
        "runtimeArgs": [
            "run-script",
            "start",
            "--",
            "--inspect-brk=9229"
        ],
         "port": 9229
    },

  ]
}

和

{
  "type": "node",
  "request": "launch",
  "name": "Launch Node App",
  "program": "${workspaceFolder}/my-app/my-npm-start-script-dir/index.js"
}

指定tasks.json。