Usando o node-inspector com tarefas Grunt

101

Alguém usou o node-inspector com o Grunt para depuração de aplicativos? Se não, você pode recomendar uma ferramenta de depuração para aplicativos baseados no Grunt?

Estou trabalhando com nodejs para um aplicativo do lado do servidor e tenho o Grunt para usar tarefas separadas (isso porque os usuários podem executar tarefas separadamente).

JuanO
fonte
console.log é seu amigo .. Eu adoraria acessar o node-inspector, mas acho que as ferramentas de depuração não fazem parte do V8. Pelo que entendi, as ferramentas de depuração são um aplicativo da web por direito próprio. Corrija-me se estiver errado aqui, porque eu gostaria de fazer o que você está tentando.
iancrowther
Sim, o sistema de registro (quer dizer console.log ou outro tipo de mecanismo de registro) será sempre nosso amigo, mas o que estou precisando é de uma forma diferente e mais depurável. Até agora, encontrei alguns requisitos ausentes para meu projeto com o grunt, então eu removi agora e estou usando nodejs como ele próprio para que possa depurar usando o node-inspector agora. Eu sei, não é a solução, mas funciona. Acho que, no futuro, adicionarei o grunt novamente com o node-inspector e outras ferramentas / recursos adicionados. Por último mas não menos importante, grunhido é incrível! Estou usando em outros projetos e é demais!
JuanO
Apenas comecei a brincar com Grunt, também interessado nessa questão ...
Dmitry Pashkevich
@iancrowther, as ferramentas que o inspetor da web usa estão no V8. Há um projeto chamado node-inspectorque fala com node --debug, fornecendo as informações de depuração para um navegador que se conecta. Isso é incrível, porque você pode conectar o Chrome ao processo de inspetor de nó e usar todas as ferramentas do inspetor da web para depurar seu aplicativo. github.com/dannycoates/node-inspector
David Souther

Respostas:

135

Para executar o grunt na depuração, você precisa passar o script do grunt para o nó explicitamente:

node-debug $(which grunt) task

e coloque uma debugger;linha em sua tarefa. node-inspectorirá então abrir um navegador com ferramentas de depuração.

Editar 28 de fevereiro de 2014

node-inspectoradicionou o comando node-debug, que ativa o nó em um --debugestado e abre o navegador para a node-inspectorpágina, parando quando atinge a primeira debuggerlinha ou ponto de interrupção definido.

Editar 30 de janeiro de 2015

No Windows, as coisas são um pouco mais complicadas. Veja a resposta de @ e.gluhotorenko para obter instruções.

David Souther
fonte
1
Isso é ótimo. Ele também funciona em outros bins npm instalados globalmente.
pllee de
1
A tarefa node debug $ (which grunt) usa o depurador padrão nodejs
Tomas Romero
3
Estou tendo um pouco de dificuldade com isso. Você poderia esclarecer o que $(which grunt)é? É apenas o Gruntfile.js que desejo depurar? E para taskeu coloco (usando servecomo exemplo) grunt serveou apenas serve? Eu tentei node-debug Gruntfile.js servee muitas outras coisas, mas simplesmente não consigo fazer isso funcionar. O Node-inspector abre e quebra na primeira linha, mas não consigo interromper a servetarefa, mesmo se colocar uma debugger;linha como a primeira linha da função.
Brett
2
@brett, você está no Windows ou OSX / Linux? No unix, $ (which grunt) é substituído pelo caminho completo para o grunt.jsscript grunt-cli . Esse é o script que realmente executa o Grunt. Se você estiver no Windows, consulte stackoverflow.com/a/13443026/240358 (a resposta abaixo disso) para uma possível localização do script grunt-cli. Isso toma o lugar de gruntem seu comando - no seu exemplo, substitua taskporserve
David Souther
Obrigado @DavidSouther, deseja adicionar a parte específica do Windows à sua resposta? Eu realmente deveria fazer a mudança para o Linux ...
Brett
39

Solução Windows

Corre

node --debug-brk c:\Users\username\AppData\Roaming\npm\node_modules\grunt-cli\bin\grunt taskname

do cmd no diretório com o seu Gruntfile.js. Não se esqueça de colocar a debugger;linha nos locais necessários.

Eugene Gluhotorenko
fonte
3
Começando com grunt 0.4, o ponto de entrada do grunt faz parte do grunt-clipacote:node --debug-brk [..]\node_modules\grunt-cli\bin\grunt
mistaecko
4
Muito obrigado pelas instruções do Windows. No PowerShell, você pode usar o til para tornar isso um pouco menos frágilnode --debug-brk (Resolve-Path ~\AppData\Roaming\npm\node_modules\grunt-cli\bin\grunt) taskname
George Mauer
Cara, acabei de passar 30 minutos descobrindo isso e atualizando minha resposta! Eu deveria ter apenas rolado para baixo!
David Souther
1
Não se esqueça de abrir outro console e executarnode-inspector
valter.santos.matos
@ valter.santos.matos na verdade agora você deve usar o nó --inspect mencionado abaixo
Jackie
7

Para depurar, temos que modificar o arquivo grunt em bin. Na minha máquina, o grunt é instalado globalmente, então fui para / usr / local / lib / node_modules / grunt / bin, abri o arquivo e modifiquei:

#!/usr/bin/env node

Para

#!/usr/bin/env node --debug-brk

--debug-brk irá quebrar na primeira linha do javascript executado.

Fazer isso sozinho não é suficiente, pois você não será capaz de encontrar seu arquivo js de tarefa grunt no menu suspenso no inspetor de nó, então você tem que modificar o arquivo que você está interessado em depurar adicionando debugger;onde você quer que o ponto de interrupção aconteça. Agora você pode clicar em continuar após o primeiro intervalo, e você quebrará na sua debugger;linha

Bastante desajeitado, mas é a única maneira que encontrei até agora.

user1577390
fonte
2
Isso é incrivelmente confuso, já que depende de uma variedade de comportamentos em / usr / bin / env e magia não documentada entre # e \ n na linha shebang.
David Souther,
2
Isto não funciona para mim. O Grunt ainda funciona sem o modo de depuração.
Eugene Gluhotorenko
@DavidSouther Shebangs não são mágicas indocumentadas. Eles são um comportamento POSIX padronizado
Miles Rout
6

Recentemente criei o grunt-node-inspector para configurar facilmente o node-inspector com o resto do seu fluxo de trabalho do grunt, verifique: https://github.com/ChrisWren/grunt-node-inspector

Aqui está uma seção de um Gruntfile que ilustra como você pode depurar uma tarefa grunt usando grunt-node-inspector, grunt-concurrent e grunt-shell: https://github.com/CabinJS/Cabin/blob/master/Gruntfile. js # L44-L77

ChrisWren
fonte
Você está pensando, node --debug-brk $(which grunt) node-inspector build testtipo de coisa correr ? Eu gosto disso.
David Souther
Praticamente, exceto que eu uso simultâneo, porque node-inspectornão vai sair e permitir builde testexecutar, uma vez que funciona para sempre. Eu adicionei um link para um snippet onde o tenho configurado.
ChrisWren
Hmm. Pensando bem ... meu fluxo de trabalho está apenas começando node-inspector &, deixando-o em segundo plano e concluindo. Alguma ideia sua sobre isso?
David Souther
1
Não sei por que, mas isso não parece funcionar para mim. Eu executo o comando grunt node-inspectore, em seguida, vou para a url do host local e não vejo nenhum arquivo de origem. Apenas esvazie as ferramentas do depurador.
Kris Hollenbeck
Consegui fazer com que a fonte aparecesse executando dois comandos separados. grunt node-inspectore node --debug-brk Gruntfile.jsdo meu diretório grunt. No entanto, quando eu defino um ponto de interrupção no arquivo grunt, ele simplesmente trava com um erro de conexão.
Kris Hollenbeck
4

Eu fiz uma tarefa para executar meu aplicativo e iniciar o node-inspector. É muito melhor do que a proposta atual, você só precisa adicionar esta tarefa no gruntfile:

  grunt.registerTask('debug', 'My debug task.', function() {
        var done = this.async();
        grunt.util.spawn({
            cmd: 'node',
            args: ['--debug', 'app.js'],
            opts: {
                //cwd: current workin directory
            }
        },
        function (error, result, code) {
            if (error) {
                grunt.log.write (result);
                grunt.fail.fatal(error);
            }
            done();
        });
        grunt.log.writeln ('node started');
        grunt.util.spawn({
            cmd: 'node-inspector',
            args: ['&'],
            opts: {
                //cwd: current workin directory
            }
        },
        function (error, result, code) {
            if (error) {
                grunt.log.write (result);
                grunt.fail.fatal(error);
            }
            done();
        });
        grunt.log.writeln ('inspector started');
    });
olivier dufour
fonte
1
O autor de grunt-node-inspector está certo. Esta solução só funciona em ambientes posix enquanto o seu é mais fácil de configurar o node-inspector e com o concorrente funciona em posix e windows.
rainabba
3

Ótimas respostas aqui. Em 2017, agora você pode fazer

node --inspect --debug-brk $(which grunt) taskName

Que imprime algo parecido.

To start debugging, open the following URL in Chrome: chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:9229/232652c3-f63c-4b00-8de9-17dfad5db471

Abra esse URL no Chrome e pronto!

Estou usando o Node 7.3.0 e estou no Mac. Talvez você precise seguir alguns dos conselhos em outras postagens para implementá-lo no Windows.

RoccoB
fonte
2

Atualização de 2019

  • Se você deseja iniciar a tarefa grunt no modo de depuração e interromper na primeira linha:

    node --inspect-brk $(which grunt) taskName

  • Se você deseja iniciar a tarefa grunt no modo de depuração em uma porta específica:

    node --inspect-brk=8080 $(which grunt) taskName

  • se você deseja anexar VSCODE ao processo do nó que executa a sessão de depuração do grunt, use a seguinte configuração em vscode:

{
  // 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": "attach",
      "name": "Attach by port IP 5656",
      "port": 8080
    }
  ]
}
ZEE
fonte