web-dev-qa-db-fra.com

Comment déboguer un projet nodemon dans VSCode

J'ai un projet NodeJs et je l'exécute en utilisant nodemon,
Je souhaite l'exécuter en mode débogage pour les tâches de développement, mais je ne peux pas le faire.

J'ai trouvé que je devrais ajouter la bonne configuration au fichier launch.json dans le dossier .vscode,
J'ai un app.js fichier qui est le fichier d'application principal.
Et l'application s'exécute sur node version 4.6.2 et sur Port 8080.
Dans le cas habituel, je lance l'application en utilisant npm run dev commande.

Voici mon fichier launch.json - 

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.Microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "MyApp",
            "program": "${workspaceFolder}/app.js",
            "runtimeVersion": "4.6.2",
            "protocol": "legacy",
            "port": 8080
            //"runtimeExecutable": "/home/user/.nvm/versions/node/v4.6.2/bin/node"
        },
        {
            "type": "node",
            "request": "launch",
            "name": "nodemon",
            "runtimeExecutable": "nodemon",
            "program": "${workspaceRoot}/app.js",
            "restart": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen",
            "runtimeVersion": "4.6.2",
            "protocol": "legacy",
            "port": 8080
        },
        {
            "type": "node",
            "request": "launch",
            "name": "DEBUG",
            "runtimeExecutable": "nodemon",
            "program": "${workspaceFolder}/app.js",
            "restart": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen",
            "runtimeVersion": "4.6.2",
            "protocol": "legacy",
            "port": 8080
        }
    ]
}

Le package.json est le suivant - 

{
  "name": "myapp",
  "description": "myapp",
  "version": "1.35.0",
  "private": true,
  "scripts": {
    "dev": "nodemon app.js",
    "debug": "nodemon app.js"
  },
  "dependencies": {
    "async": "1.3.0",
    "aws-sdk": "2.7.20",
    "aws-xray-sdk": "^2.1.0",
    "aws-xray-sdk-restify": "^1.3.0-beta",
    "bcrypt": "0.8.5",
    "body-parser": "1.12.3",
    "compression": "^1.7.0",
    "connect-flash": "0.1.1",
    "cookie-parser": "1.3.4",
    "cron": "1.0.9",
    "csurf": "^1.9.0",
    "csvtojson": "^1.1.2",
    "date-utils": "1.2.16",
    "dotenv": "4.0.0",
    "email-templates": "1.2.1",
    "express": "4.12.3",
    "express-handlebars": "2.0.0",
    "express-jwt": "^5.1.0",
    "express-mailer": "0.2.4",
    "express-session": "1.11.1",
    "express-validator": "3.1.3",
    "handlebars": "^3.0.3",
    "helmet": "^3.5.0",
    "html-pdf": "1.4.0",
    "json-2-csv": "2.0.12",
    "jsonwebtoken": "^7.3.0",
    "multer": "^0.1.8",
    "mysql": "2.6.2",
    "newrelic": "1.25.0",
    "node-schedule": "^1.3.0",
    "nodemailer": "^1.3.4",
    "nodemailer-ses-transport": "1.2.0",
    "passport": "0.2.1",
    "passport-local": "1.0.0",
    "path": "0.11.14",
    "promise": "7.0.0",
    "qs": "^2.4.1",
    "replaceall": "0.1.6",
    "request": "2.55.0",
    "run-parallel": "1.1.0",
    "validator": "^7.0.0",
    "winston": "^2.3.1",
    "winston-daily-rotate-file": "^1.7.0",
    "xlsx": "0.8.8"
  },
  "devDependencies": {
    "nodemon": "^1.17.3"
  }
}

L'application est lancée lorsque j'exécute les configurations DEBUG et nodemon,
Mais le code ne s'arrête pas sur les points d'arrêt que j'ai mis dans le fichier app.js.

Liens de référence -
1. https://github.com/Microsoft/vscode-recipes/tree/master/nodemon
2. https://github.com/bdspen/nodemon_vscode
3. Visual Studio Code peut-il être configuré pour se lancer avec nodemon
4. Impossible de déboguer dans VSCode en l'attachant à Chrome
5. https://code.visualstudio.com/docs/editor/debugging

Quelles modifications sont nécessaires dans package.json, ou toute correction dans Launch configuration - launch.json, qui m'aiderait à déboguer l'application dans VSCode pour mon cas d'utilisation?

node.jsdebuggingvisual-studio-codenodemonvscode-debugger
5
Ani

Dans la configuration de vscode, vous pouvez définir le runtimeExecutable qui exécutera le programme que vous donnez. ensemble restart:true afin que le débogueur de code puisse redémarrer le processus.

Ceci est un exemple de configuration:

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node", 
            "request": "launch",
            "name": "nodemon",
            "runtimeExecutable": "nodemon",
            "program": "${workspaceFolder}/bin/www",
            "restart": true,
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen",
            "env": {
                "debug": "app:*",
            }
        }
    ]
}

C'est plus simple que d'attacher le débogueur au processus de noeud en cours d'exécution. Gardez le type

2
Ridham Tarpara

Vous pouvez lancer et attacher nodemon avec F5, mais cela nécessitera un peu plus de configuration.

Nous devrons d'abord pré-lancer nodemon via la tâche VS Code puis attacher.

J'utilise le débogueur distant pour attacher car il ne nécessite pas de clics supplémentaires pour sélectionner le processus à attacher, et le sélecteur de processus VS Code est actuellement cassé dans WSL2 , qui est mon environnement de développement principal.

tasks.json (de cette réponse ):

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "npm dev",
      "type": "npm",
      "script": "dev",
      "isBackground": true,

      // This task is run before some debug tasks.
      // Problem is, it's a watch script, and since it never exits, VSCode
      // complains. All this is needed so VSCode just lets it run.
      "problemMatcher": [
        {
          "pattern": [
            {
              "regexp": ".",
              "file": 1,
              "location": 2,
              "message": 3
            }
          ],
          "background": {
            "activeOnStart": true,
            "beginsPattern": ".",
            "endsPattern": "."
          }
        }
      ]
    }
  ]
}

launch.json:

{
  "type": "node",
  "request": "attach",
  "name": "Launch & Attach",
  "restart": true,
  "localRoot": "${workspaceRoot}",
  "remoteRoot": "${workspaceRoot}",
  "preLaunchTask": "npm dev"
}

Et dans le script de développement npm (pour node> = 6.9):

nodemon --watch src -e js --exec node --inspect .

Remarque - cette approche ne fonctionnera pas si votre processus prend plus de 10 secondes pour démarrer. Dans ce cas, vous devrez déterminer comment signaler VS Code lorsque la tâche de pré-lancement est terminée. Cela peut probablement être réalisé en jouant avec regex beginPattern/endPattern, même si je ne l'ai pas essayé.

0
kDar

Comme le propose @the Geek,

  1. Vous devez modifier launch.json comme suit:

    {
    "version": "0.2.0",
    "configurations": 
  [    
    {
        "type": "node",
        "request": "attach",
        "name": "Attach by Process ID",
        "processId": "${command:PickProcess}"
    }
  ]
}

  2. Démarrez le serveur "npm run dev" (comme vous pouvez le voir, dans la propriété "request", nous définissons l'attachement. Nous devons donc d'abord exécuter le serveur puis attacher le débogueur).

  3. Cliquez sur le côté gauche de vscode dans l'icône de type bogue. En haut, vous verrez la petite icône verte de lecture. Cliquez sur la flèche déroulante à droite de celui-ci et sélectionnez "Joindre par ID de processus".

  4. Cliquez sur l'icône de lecture, puis une barre en bas de vscode devrait devenir orange foncé. Essayez maintenant de faire une demande. Les points d'arrêt seront correctement atteints!

0
Andreas