如何为将 dev-tool 设置为 source-map 的缩小包获取 webpack 生产环境的可读堆栈跟踪?

How to get a readable stack trace for a webpack production environment for a minified bundle with dev-tool set to source-map?

是否可以为 minified[=23] 的 webpack production 环境获取 readable 堆栈跟踪=] 捆绑开发工具设置为 source-map?我是 运行 Typescript 并且对 Webpack 构建做出反应。下面的清单显示了抛出的异常示例:

http://localhost:8080/vendors~course-list.3042c44300bc08021f63.bundle.js:2:6029
http://localhost:8080/vendors~course-list.3042c44300bc08021f63.bundle.js:2:5067

in w in b in withRouter(b) in e in e in Suspense in div in e in e in S

在上面的堆栈跟踪中,可以通过将 devtool 选项设置为 source-map:

进行以下观察
  • 名称保持最小化,例如w、b和e。
  • 报告的错误位置最少,例如行号和列 数字。

我正在使用这个 npm 包,它运行良好:)

https://www.npmjs.com/package/sourcemapped-stacktrace

示例:

    import * as sourceStackTrace from 'sourcemapped-stacktrace';
    ...

    const minifiedStack = new Error().stack;
    sourceStackTrace.mapStackTrace(minifiedStack, (stackTrace: string[]) => {
        // Do your thing here
    });