Aws lambda + webpacks + typescript --> how to debug/trace in vcode?

I had created an AWS Lambda with a serverless framework and used their template to create a lambda:
sls create --template aws-nodejs-typescript

that would create a default example, aka hello lambda with webpack.
How would I debug/trace this lambda executed locally inside vcode?

I had tried but got an error message:

[offline] Loading handler... (/Users/mickey/vault/github/backend-work/merlin-lambdas/be-ts-sponsored/.build/.webpack/service/src/functions/hello/handler)
[offline] _____ HANDLER RESOLVED _____
offline: Failure: Cannot find module '/Users/mickey/vault/github/backend-work/merlin-lambdas/be-ts-sponsored/.build/.webpack/service/src/functions/hello/handler'
Require stack:
- /Users/mickey/vault/github/backend-work/merlin-lambdas/be-ts-sponsored/node_modules/serverless-offline/dist/lambda/handler-runner/in-process-runner/InProcessRunner.js

my VCode debug config is:

  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit:
  "version": "0.2.0",
  "configurations": [
      "type": "node",
      "request": "launch",
      "name": "DEBUG",
      "runtimeExecutable": "npm",
      "cwd": "${workspaceRoot}",
      "runtimeArgs": [
      "console": "integratedTerminal",
      "restart": true,
      "internalConsoleOptions": "neverOpen",
      "port": 9229

and package.json file contains the debug as:

"scripts": {
    "start": "serverless offline -s dev",
    "build": "yarn tsc",
    "tsc": "tsc --project tsconfig.json",
    "debug": "export SLS_DEBUG=* && node --inspect ./node_modules/.bin/serverless offline -s dev",
    "test": "echo \"Error: no test specified\" && exit 1"

thank you for your help