Wrong stack trace with webpack

[demian85]

I'm getting this:

TypeError: Cannot read property 'length' of undefined
    at t.handler (/var/task/webpack:/src/main.ts:16:38)
    at invoke (/var/runtime/node_modules/awslambda/index.js:285:5)
    at InvokeManager.start (/var/runtime/node_modules/awslambda/index.js:151:9)

I think the webpack: part should not be there.

[morgs32]

Could this have to do with the webpack generated sourcemap?

[buaazhangfan]

Hi, can you provide how to use this on webpack?

[tonyfromundefined]

@demian85 is this solved? I have a same problem

[tonyfromundefined]

https://webpack.js.org/configuration/output/#outputdevtoolmodulefilenametemplate

here is the solution

module.exports = {
  output: {
    path: path.resolve(__dirname, './dist'),
    devtoolModuleFilenameTemplate: '../[resource-path]',
  },
}

[LinusU]

Thanks @tonyfromundefined, that's great!

[demian85]

So the fix is to remove the `webpack://` thing then? why is it there anyway? Can I just leave '[namespace]/[resource-path]?[loaders]'?

…

On Thu, Nov 21, 2019 at 8:15 AM Linus Unnebäck ***@***.***> wrote: Thanks @tonyfromundefined <https://github.com/tonyfromundefined>, that's great! — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#238?email_source=notifications&email_token=AADS4ZSMX6VXB675TVOITCDQUZUUBA5CNFSM4HCADJL2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEEZ3ZWI#issuecomment-557038809>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AADS4ZT56524GM26UFNARWTQUZUUBANCNFSM4HCADJLQ> .

[LinusU]

I think that the source maps says webpack:// so I'm not really sure that it would be correct to remove it?

What do you want it to say? /var/task/src/main.ts or webpack:/src/main.ts? 🤔

[tonyfromundefined]

If your webpack build environment is the same as your Node.js running environment (usually at development time), you can provide [absolute-resource-path] with the devtoolModuleFilenameTemplate option.

If it is different (using CI/CD), it is better to use relative paths. (ex: ../[resource-path])

And I decided to use Sentry's Release feature. (upload webpack bundle and sourcemap file in Sentry in release time (in the CircleCI), Sentry merge them and show proper stack trace)

https://docs.sentry.io/workflow/releases

[fronterior]

// webpack.config.ts
const projectRootDir = path.resolve(); // Root directory of project, need to be modified if necessary
const dotPaths = projectRootDir.split('/').map(() => '..').join('/'); // ../../../..

...
  output: {
    path: path.resolve(rootDir, 'dist/main'),
    devtoolModuleFilenameTemplate: `${dotPaths}/../../[resource-path]`, // '..' is required as many folders as entered in output.path
  }
...

In this way, I was able to create a clickable path in the VSCode terminal without 'webpack:' path.