typescriptbreakpointsvscode-debugger

VSCode can't inspect variables in Typescript debugger auto attach


I am working on a project in Typescript with yarn,

I am running on Windows and vscode is connected to WSL. (I have run code . to open my project). My project is directly on my WSL partition.

I have set up my vscode to auto attach (Smart).

When I put a breakpoint in my code I can reach the breakpoint, but I cannot inspect my variables (seems they are all undefined), even if I type the variable in the WATCH panel, the value of my variable is : Uncaught ReferenceError: VARIABLE_NAME is not defined.

Here is some information about my configuration :

tsconfig.json :

{
    "compilerOptions": {
        "rootDir": "./src",
        "outDir": "./dist",
        "baseUrl": "./src",
        "module": "commonjs",
        "target": "es6",
        "lib": ["es6", "dom", "esnext"],
        "moduleResolution": "node",
        "sourceMap": true,
        "declaration": true,
        "declarationMap": true,
        "noImplicitAny": true,
        "noUnusedLocals": true,
        "noImplicitThis": true,
        "strictNullChecks": true,
        "noImplicitReturns": true,
        "preserveConstEnums": true,
        "esModuleInterop": true,
        "resolveJsonModule": true,
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true
    },
    "include": ["**/*.ts"],
    "exclude": ["dist", "node_modules"]
}

Here is how I build my project :

esbuild src/index.ts --outfile=dist/index.js --bundle --platform=node --packages=external --minify --sourcemap --tsconfig=./tsconfig.json

Solution

  • The problem was the --minify option in esbuild command to build my project.

    So I've made a build command for developpment without the minify option :

    esbuild src/index.ts --outfile=dist/index.js --bundle --platform=node --packages=external --sourcemap --tsconfig=./tsconfig.json
    
    

    Now I can inspect the value of my variable.