tsx icon indicating copy to clipboard operation
tsx copied to clipboard

tsx in vs code debugger watching the dist files rather than the src ts file for changes

Open RahulBadenkal opened this issue 5 months ago • 0 comments

Acknowledgements

  • [X] I read the documentation and searched existing issues to avoid duplicates
  • [X] I understand this is a bug tracker and anything other than a proven bug will be closed
  • [X] I understand this is a free project and relies on community contributions
  • [X] I read and understood the Contribution guide

Minimal reproduction URL

https://stackblitz.com/edit/node-i1hqro

Problem & expected behavior (under 200 words)

Setup (same as attached stackblitz link)

main.ts

type Name = string;

export const sayHello = (name: Name) => {
  console.log('Hello', name);
}

sayHello('World');

esbuild.config.mjs

import { build } from 'esbuild';
import { resolve } from 'path';


await build({
  entryPoints: [resolve(process.cwd(), 'main.ts')],
  outfile: resolve(process.cwd(), 'dist', 'index.mjs'),
  bundle: true,
  platform: 'node',
  format: 'esm',
  minify: false,
  sourcemap: true,
  external: ["node_modules/*"]
})

launch.json

{
    "version": "0.2.0",
    "configurations": [
      {
        "name": "current file",
        "type": "node",
        "request": "launch",
  
        // Debug current file in VSCode
        "program": "${file}",
  
        /*
         * Path to tsx binary
         * Assuming locally installed
         */
        "runtimeExecutable": "tsx",
        "runtimeArgs": ["watch", "--inspect"],
  
        /*
         * Open terminal when debugging starts (Optional)
         * Useful to see console.logs
         */
        "console": "integratedTerminal",
        "internalConsoleOptions": "neverOpen",
  
        // Files to exclude from debugger (e.g. call stack)
        "skipFiles": [
          // Node.js internal core modules
          "<node_internals>/**",
  
          // Ignore all dependencies (optional)
          "${workspaceFolder}/node_modules/**"
        ]
      }
    ]
  }

Steps to reproduce

  1. Run the app via the vs code debugger, make changes, the changes reflect and the debugger restarts -> working as expected image

  2. Now run the build node esbuild.config.js. It produces dist/index.mjs. Now run the program via the debugger again, instead of watching main.ts, its logs say its watching dist/index.mjs, which it should not. Thus any change i make in main.ts is not causing the debugger to refresh image

Bugs are expected to be fixed by those affected by it

  • [x] I'm interested in working on this issue

Compensating engineering work will speed up resolution and support the project

  • [ ] I'm willing to offer $10 for financial support

RahulBadenkal avatar Sep 15 '24 01:09 RahulBadenkal