DEV Community

Henrique Marques Fernandes
Henrique Marques Fernandes

Posted on • Originally published at marquesfernandes.com on

VS Code debug com ts-node e ts-node-dev no Docker

Se você está tendo problema para debuggar no VS Code os seus projetos com Typescript que usam ts-node ou ts-node-dev, como linhas erradas no debbuger ou ele não selecionando nenhuma linha, não se preocupe, a solução é simples.

Por algum motivo o debugger do VS Code se confunde ao tentar interpretar os arquivos .map e acaba selecionando as linhas erradas, o que pode inviabilizar o uso do debbuger na sua aplicação. Essa solução serve também para quem estiver desenvolvendo com Docker.

Explicarei passo a passo as configurações para que você identifique qualquer possível problema em seu projeto.

Configurando o package.json

Ele deve incluir o ts-node ou ts-node-dev nas suas dependências:

"devDependencies": { "ts-node": "8.9.0", "ts-node-dev": "1.0.0-pre.44",}

Crie um script para rodar o seu projeto com ts-node-dev ou ts-node:

"scripts": { "dev": "ts-node-dev --inspect=0.0.0.0:7001 --exit-child --respawn src/index.ts",}

Configurando seu tsconfig.json

Precisamos sempre habilitar a opção de sourceMap em compilerOptions, essa opção faz com que o compilador gere os arquivos de mapeamento necessários para o debug funcionar corretamente:

"compilerOptions": { ... "sourceMap": true}

Configurando o debugger do VS Code

Crie ou modifique seu .vscode/launch.json . Não esqueça de configurar para a porta que configuramos nosso script de execução nopackage.json .

{ "version": "0.2.0", "configurations": [{ "type": "node", "request": "attach", "name": "Docker: Attach to Node", "port": 7001, "address": "localhost", "localRoot": "${workspaceFolder}", "sourceMapPathOverrides": { "/app/\*": "${workspaceRoot}/\*" }, "remoteRoot": "/app/" }]}

A sacada está aqui na propriedade sourceMapPathOverrides, precisamos explicitamente indicar para o debugger qual o caminho ele deverá seguir dos arquivos sourcemap para os arquivos dentro do contêiner Docker.

"sourceMapPathOverrides": {
  "<WORKDIR>/\*": "${workspaceRoot}/\*"
}

Existe uma issue em aberto no repositório do Typescriptsobre esse problema, por enquanto a solução é usar essa configuração.

Agradecimentos a solução original: https://medium.com/@mitsuhideohi/debugging-uncompiled-typescript-code-running-on-a-docker-container-213418ab2b1f

O post VS Code debug com ts-node e ts-node-dev no Docker apareceu primeiro em Henrique Marques Fernandes.

Top comments (0)