VSCode Debug SourceMap Location

[JumaBok]

Describe your idea/feature/enhancement

I'm not sure if this already exists, but I can't see it readily documented. I'd like to be able to debug locally in VSCode using a launch configuration, and using the new typescript beta-features. While esbuild is emitting sourcemaps, it's dropping those into the .aws-sam/build/** folders and therefore the debug cannot locate them relative to the source code.

Is there a way for me to specify an alternative location for the sourcemaps to be emitted, or can I tell VSCode where to look? I've tried to add resolveSourceMapLocations but it doesn't recognise the option under the configuration type of aws-sam.

Thanks!

[moelasmar]

Thanks @JumaBok for raising this feature request.

[orrenbizz]

Is there a workaround for this?

[ffMathy]

We have this issue too.

[dgokcin]

Having the same issue.

[Ugikie]

Would love to know a solution for this as well

[eternal-eager-beaver]

Having the same issue

[dgokcin]

@eternal-eager-beaver @Ugikie @ffMathy @orrenbizz @JumaBok I have spent countless hours debugging why debugging was not working when I first faced this issue and wanted to update this issue with my workaround. It is a little bit ugly/fragile but it works.

I worked around this limitations using some scripting magic in vscodeslaunch.json & tasks.json and slightly modifying the tsconfig.json and enabling the sourcemap option in the SAM template.

• Review the changes I made in this commit and do the needed changes accordingly. Here is a brief explanation for each important change

.vscode/launch.json

• Added Configuration: A new debugging configuration code:HelloWorldFunction was added. This configuration:
  • Targets the code directly (target: "code"), specifying the lambda handler (lambdaHandler: "app.lambdaHandler") and the project root.
  • Sets the architecture to x86_64 and specifies the runtime as nodejs20.x, ensuring compatibility with the latest Node.js features and performance improvements.
  • Uses a pre-launch task (Watch All), likely set up to compile TypeScript to JavaScript and watch for changes, ensuring that the latest code is always deployed and debugged.

.gitignore

• Updated Entries: Added entries for build/ and **aws-toolkit-tsconfig.json, preventing build artifacts and specific configuration files from being tracked by Git. This keeps the repository clean and avoids potential conflicts or discrepancies caused by environment-specific files.

tasks.json in .vscode/

• Added Tasks: New tasks for npm install, TypeScript compilation, and a post-compilation task were added. These tasks ensure that all dependencies are installed, the TypeScript is compiled to JavaScript, and any necessary cleanup or additional setup is performed after compilation.
• Organized Tasks: Tasks are organized into groups and dependencies, streamlining the build process and ensuring that tasks are executed in the correct order.

tsconfig.json

• Source Maps Enabled: Setting sourceMap to true allows generation of source maps, which are crucial for debugging TypeScript in production environments as they map the compiled JavaScript back to the original TypeScript source code.
• Module System: Changed to CommonJS, which is compatible with Node.js and simplifies the integration with AWS Lambda, which expects this module format.
• Output Directory: Specified an outDir, organizing compiled files separately from source files, which helps in clean deployments.

template.yaml

• Enabled Source Maps: The source map setting was enabled, allowing AWS SAM to use source maps during the build process. Ideally, I expected just doing this to handle everything automatically.

• Select the code:HelloWorldFunction from the Run and Debug Menu and enjoy debugging 🎉