web-dev-qa-db-fra.com

Comment déboguer en utilisant les scripts d'exécution npm à partir de VSCode?

J'utilisais précédemment gulp et j'exécutais gulp pour démarrer mon application et les écouteurs du débogueur Visual Studio Code , mais j'ai récemment dû passer à l'exécution de scripts via npm à la place. Malheureusement, je n'ai pas pu utiliser VSCode pour pouvoir exécuter des scripts npm via le débogueur. J'ai donc dû exécuter node pour démarrer directement mon serveur, ce qui supprime les tâches de mon auditeur qui rechargent automatiquement le code. 

Cela semble être quelque chose qui devrait être simple, mais jusqu'à présent, je n'ai pas eu beaucoup de chance. Vous trouverez ci-dessous un extrait de mon fichier launch.json que j'ai tenté d'utiliser mais que npm n'a pas pu être localisé.

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

Cela me donne l'erreur suivante.

La requête d'erreur 'lancement': le programme 'c:\monprojet\npm' n'existe pas

Ressources associées:

31
jpierson

Il semble que VS Code prenne en charge les scripts npm et d’autres scénarios de lancement dans la version d’octobre 2016 .

Vous trouverez ci-dessous un exemple tel que proposé sur GitHub .

packages.json

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

vscode lance config

{
    "name": "Launch via NPM",
    "type": "node",
    "request": "launch",
    "cwd": "${workspaceRoot}",
    "runtimeExecutable": "npm",
    "runtimeArgs": [
        "run-script", "debug"
    ],
    "port": 5858
}
19
jpierson
  1. Configurez une nouvelle cible de débogage dans votre fichier .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. Configurez votre npm pour exécuter le noeud avec l'option --debug-brk:

    "scripts": {
      "start": "node app.js",
      "debug": "node --debug-brk app.js"
      ...
    
  3. Lancez votre application à partir du shell en tant que:

     $npm run debug
    
  4. Le programme attendra par défaut sur le port 5858 pour connecter le débogueur

  5. Exécutez donc le débogueur dans votre code Visual Studio ("Attach To npm").

  6. Profitez de votre débogueur :)

16
GutiMac

J'ai essayé les solutions proposées par GutiMac et Jpierson, mais pour certaines raisons, je n'ai pas réussi à faire fonctionner le débogueur avec ces solutions.

Une solution alternative qui a bien fonctionné pour moi (Ubuntu 16, nœud 8.9.1, VS 1.8.1) consiste à utiliser ce lanceur d'applications simple (à ajouter dans le tableau de configuration de VS launch.json):

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

C'est faisable avec npm sans avoir à modifier votre section scripts dans package.json

Le truc ici est de passer le --inspect-brk=9229 au noeud.

La commande ressemblera à npm run start -- --inspect-brk=9229

Voici le .vscode/launch.json:

{  
"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
    },

  ]
}
0
Tudor Ilisoi