Razzle: Déboguer le serveur de nœud avec vscode

Créé le 20 mars 2018  ·  11Commentaires  ·  Source: jaredpalmer/razzle

J'essaie de déboguer le serveur de nœud avec vscode. Je lance yarn start --inspect et j'attache le débogueur avec cette configuration dans mon launch.json

{
   "type": "node",
   "request": "attach",
   "name": "Attach",
   "port": 9230,
   "outFiles": [
      "${workspaceRoot}/build/**/*.js"
   ]
}

Je peux définir un point d'arrêt dans build/server.js (un point rouge) mais je ne pouvais pas le définir dans src/index.js (un cercle gris). Qu'est-ce que je fais de mal avec les sourcemaps :thinking: ?

stale

Commentaire le plus utile

J'ai résolu ce problème en utilisant un paramètre sourcemap différent, VSCode ne semble pas aimer celui cheap-module-sourcemap .
razzle.config.js :

module.exports = {
    modify(config, { target, dev }, webpack) {
        config.devtool = dev ? 'eval-source-map' : 'none';
        return config;
    }
}

launch.json :

{
    "name": "Attach to dev server",
    "type": "node",
    "request": "attach",
    "protocol": "inspector",
    "address": "localhost",
    "port": 9230
}

et démarrez le serveur avec yarn start --inspect --inspect-port 9230

* édité, merci @dguyonvarch d'avoir détecté l'erreur.

Tous les 11 commentaires

J'ai de la chance avec l'attachement par identifiant de processus. Il existe également une option de configuration de lancement vscode sourceMaps que vous pouvez définir sur true.

    {
      "type": "node",
      "request": "attach",
      "name": "Attach by Process ID",
      "processId": "${command:PickProcess}",
      "restart": true
    }

@ajsharp merci pour votre réponse :smiley_cat:

Identique à la méthode d'attachement. Je ne peux pas définir de point d'arrêt dans src/index.js.

L'option sourceMaps est true par défaut (cf. https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_source-maps)

J'ai résolu ce problème en utilisant un paramètre sourcemap différent, VSCode ne semble pas aimer celui cheap-module-sourcemap .
razzle.config.js :

module.exports = {
    modify(config, { target, dev }, webpack) {
        config.devtool = dev ? 'eval-source-map' : 'none';
        return config;
    }
}

launch.json :

{
    "name": "Attach to dev server",
    "type": "node",
    "request": "attach",
    "protocol": "inspector",
    "address": "localhost",
    "port": 9230
}

et démarrez le serveur avec yarn start --inspect --inspect-port 9230

* édité, merci @dguyonvarch d'avoir détecté l'erreur.

@benhamlin :smile_cat: Ça marche bien !
Je viens de corriger votre extrait avec:

module.exports = {
  modify: (config, { target, dev }, webpack) => {
      config.devtool = dev ? 'eval-source-map' : 'none';
      return config
  }
}

Je trouve ceci dans razzle/packages/razzle/config/createConfig.js ligne 93 :

// Controversially, decide on sourcemaps.
devtool: 'cheap-module-source-map'

Alors j'ouvre la polémique :wink: ! Pourquoi cheap-module-source-map plutôt que eval-source-map

Quelqu'un veut-il ajouter une section à la documentation sur cette recette ?

@jaredpalmer Puis-je proposer une demande de fusion avec eval-source-map ? Pas besoin de mettre à jour la doc dans ce cas.

Hola ! Voici donc l'affaire, entre l'open source et mon travail et ma vie quotidienne et ainsi de suite, j'ai beaucoup à gérer, alors j'utilise un bot GitHub pour automatiser quelques choses ici et là. Ce bot GitHub particulier va le marquer comme obsolète car il n'a pas eu d'activité récente depuis un certain temps. Il sera fermé s'il n'y a plus d'activité dans quelques jours. Ne prenez pas cela personnellement - au sérieux - il s'agit d'une action entièrement automatisée. S'il s'agit d'une erreur, faites simplement un commentaire, envoyez-moi un DM, envoyez un pigeon voyageur ou un signal de fumée.

ProBot l'a automatiquement fermé en raison de son inactivité. Criez s'il s'agit d'une erreur, et nous le rouvrirons.

Mise à jour : Une meilleure façon d'obtenir vscode pour déboguer le serveur est d'ajouter ceci à votre launch.json, et de laisser la configuration devtool à la valeur par défaut de Razzle.

Cela permettra le débogage de VSCode, ainsi qu'une meilleure expérience de débogage client (eval-source-maps casse la visionneuse d'erreurs de débogage de React).

"sourceMapPathOverrides": {
    "webpack:///*": "${workspaceRoot}/*"
 }

Merci @benhamlin. S'il y a moyen de se reconnecter facilement à l'instance du débogueur dans VSCode après avoir effectué un redémarrage progressif ( rs puis ENTER ) dans Razzle?

ATM si je fais un redémarrage progressif, le débogueur VSCode se déconnecte, je dois donc tuer le serveur et le redémarrer puis reconnecter le débogueur.

@benhamlin Cela fonctionne comme un charme avec cette configuration :wink:

{
      "type": "node",
      "request": "attach",
      "name": "Attach",
      "port": 9230,
      "sourceMapPathOverrides": {
         "webpack:///*": "${workspaceRoot}/*"
      }
}

@ourmaninamsterdam RS redémarre le serveur sur un nouveau port de débogage (9230+1), il faut donc changer le port d'attache dans la configuration de lancement. Je n'ai pas cherché plus loin :deceve:

Cette page vous a été utile?
0 / 5 - 0 notes