Webpack＆amp; sourcemaps？

Question

我目前正在使用windows.onerror来记录生产中的javascript错误。我正在使用webpack捆绑我们的javascript并使用uglify插件进行缩小。不幸的是，ErrorEvent对象lineno和columno来自webpack生成的缩小blob。 Webpack正在生成其默认的源图文件。无论如何都要获得正确的lineno和columno？

w.addEventListener("error", handleError, true);

function handleError(e) {

    let errorToLog = {};

    if (e.message) {
        errorToLog.ErrorMessage = e.message;
    }

    if (e.filename) {
        errorToLog.source = e.filename;
    }

    if (e.lineno) {
        errorToLog.lineNumber = e.lineno;
    }

    if (e.colno) {
        errorToLog.columnNumber = e.colno;
    }

    if (e.error.stack) {
        errorToLog.stackTrace = e.error.stack;
    }

Answer 1

使用webpack＆＃39; `devtool'设置添加源地图：

{
    devtool: "#inline-source-map"
}

请注意，使用完整的源地图会增加转化时间的开销，因此如果您在开发过程中可以不使用列号，请使用更快的cheap-module-inline-source-map代替：

{
    devtool: "#cheap-module-inline-source-map"
}

Answer 2

有许多可能的问题。

最常见的是uglify现在需要明确的sourcemap: true，否则会破坏您的源地图生成。现在默认为false，因为，呃，原因。